css就近原则_8.CSS三⼤特性
1.CSS层叠性
所谓层叠性是指多种CSS样式的叠加。
是浏览器处理冲突的⼀个能⼒，如果⼀个属性通过两个相同选择器设置到同⼀个元素上，那么这个时候⼀个属性就会将另⼀个属性层叠掉。
⽐如先给某个标签指定了内部⽂字颜⾊为红⾊，接着⼜指定了颜⾊为蓝⾊，此时出现⼀个标签指定了相同样式不同值的情况，这就是样式冲突。
⼀般情况下，如果出现样式冲突，则会按照CSS书写的顺序，以最后的样式为准。
0. 样式冲突，遵循的原则是就近原则。那个样式离着结构近，就执⾏那个样式。
1. 样式不冲突，不会层叠
长江后浪推前浪，前浪死在沙滩上。
Title
码海⽆际
2.CSS继承性
所谓继承性是指书写CSS样式表时，⼦标签会继承⽗标签的某些样式，如⽂本颜⾊和字号。想要设置⼀个可继承的属性，只需将它应⽤于⽗元素即可。
简单的理解就是： ⼦承⽗业。
恰当地使⽤继承可以简化代码，降低CSS样式的复杂性。⼦元素可以继承⽗元素的样式(text-，font-，line-这些元素开头的都可以继承，以及color属性)
Title
码海⽆际
3.CSS优先级
1.CSS优先级
定义CSS样式时，经常出现两个或更多规则应⽤在同⼀元素上，这时就会出现优先级的问题。
在考虑权重时，初学者还需要注意⼀些特殊的情况，具体如下：
继承样式的权重为0。即在嵌套结构中，不管⽗元素样式的权重多⼤，被⼦元素继承时，他的权重都为0，也就是说⼦元素定义的样式会覆盖继承来的样式。
Title
码海⽆际
⾏内样式优先。应⽤style属性的元素，其⾏内样式的权重⾮常⾼，可以理解为远⼤于100。总之，他拥有⽐上⾯提⾼的选择器都⼤的优先级。
Title
码海⽆际
css 属性选择器权重相同时，CSS遵循就近原则。也就是说靠近元素的样式具有最⼤的优先级，或者说排在最后的样
式优先级最⼤。
Title
码海⽆际
CSS定义了⼀个!important命令，该命令被赋予最⼤的优先级。也就是说不管权重如何以及样式位置的远近，!important都具有最⼤优先级。
Title
码海⽆际
2.CSS特殊性
关于CSS权重，我们需要⼀套计算公式来去计算，这个就是 CSS Specificity，我们称为CSS 特性或称⾮凡性，它是⼀个衡量CSS值优先级的⼀个标准 具体规范⼊如下：
Specificity⽤⼀个四位的数字串(CSS2是三位)来表⽰，更像四个级别，值从左到右，左⾯的最⼤，⼀
级⼤于⼀级，数位之间没有进制，级别之间不可超越。
权重是可以叠加的，⽐如：
div ul  li  ------>      0,0,0,3.nav ul li  ------>      0,0,1,2a:hover      -----—>      0,0,1,1.nav a      ------>      0,0,1,1  #nav p      ------>      0,1,0,1
注意：
0. 数位之间没有进制 ⽐如说：0,0,0,5 + 0,0,0,5 =0,0,0,10 ⽽不是 0,0, 1, 0， 所以不会存在10个div能赶上⼀个类选择器的情况。
1. 继承的权重是 0 。
总结优先级：
0. 使⽤了 !important声明的规则。
1. 内嵌在 HTML 元素的 style属性⾥⾯的声明。
2. 使⽤了 ID 选择器的规则。
3. 使⽤了类选择器、属性选择器、伪元素和伪类选择器的规则。
4. 使⽤了元素选择器的规则。
5. 只包含⼀个通⽤选择器的规则。
6. 同⼀类选择器则遵循就近原则。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。