css(选择器,权重,继承)

选择器分类:

元素选择器(html,body,p)、
通配符选择器(*)、
类选择器、
ID选择器、
属性选择器(span[class~="builder"])、
特定属性选择器(img[src|="fingure"])、
后代选择器(1、后代 p a,2、子元素 p > a,3、相邻元素 p + a)、
伪类选择器(a:visited)、
伪元素选择器(设置首字母:first-letter、设置第一行:first-line、设置之前:before和设置之后:after)

权重

同一元素添加不同样式,到底是哪一个样式会生效呢。很多同学按照经验来判断,当经验不起作用的时候,没有什么不是!important不能解决的。
其实,css是根据特殊性和重要性来决定的。
特殊性计算如下(按所有选择器累加)
id选择器--0 1 0 0
类选择器、属性选择器、伪类选择器--0 0 1 0
元素选择器、伪元素选择器--0 0 0 1
通配符选择器--0 0 0 0
内联样式特殊性--1 0 0 0(<p style="font-size:16px;"></p>)
重要性 !important(超越所有特殊性)
这就是我们认为id优先级高于class的原因。

继承

继承无特殊性,易被通配符特殊性为0短路继承
边框,边距等无法继承(原因是继承边框,样式混乱,不符合设计原理)

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容