CSS三大特性

CSS(Cascading Style Sheet)三大特性

1、层叠性

  层叠性:多个样式作用在同一个元素上的时候,权重较大的会覆盖权重较小的样式,权重相同的时候,遵循就近原则:靠近元素的优先级大一点。

2、继承性

  继承性:子标签会继承父标签的某些特性,如:文本颜色,字号。恰当的使用继承可以简化代码, 降低复杂程度,子元素可以继承的属性有:line-、text-、font-、以及color。这些都是和文字属性相关的属性。

3、优先级

  在定义css样式时,经常出现多个样式作用在同一个元素上的情况,在这种情况下,就需要考虑优先级的问题了。

  优先级 即权重的衡量方式是什么?这是就是CSS的 Specifity 的计算了,具体的标准计算规范如下:

  注:CSS2是3位计算方式:0, 0, 0

继承或者*的贡献值0, 0, 0, 0
每个元素的贡献值0, 0, 0, 1
每个类、伪类、属性 选择器的贡献值0, 0, 1, 0
每个id的贡献值0, 1, 0, 0
行内样式的贡献值1, 0, 0, 0
!important的贡献值无穷大

  易错点:继承样式的权重为0,无论父级样式的权重有多大(即使为 !important),被子元素继承的时候都为0,也就是说子元素的样式会覆盖父级元素的样式!!!

总结:

  权重是优先级的算法,层叠是优先级的表现,继承影响优先级和样式