在CSS中,级联和继承有什么区别？

Question

在CSS中,级联和继承有什么区别？

或者两者都是一样的？

Answer 1

继承是关于属性如何从一个元素渗透到它的子元素.某些属性,如font-family继承.如果在其上设置了font-family,则body该字体系列将由其中的所有元素继承body.同样的情况也是如此color,但它不是真的,background或者height总是默认为transparent和auto.在大多数情况下,这才有意义.为什么背景会继承？那将是一种痛苦.如果字体没有继承怎么办？甚至会是什么样子？

该级联是什么时候有冲突什么优先.级联规则包括:

1. 以后的属性会覆盖早期属性
2. 更具体的选择器覆盖不太具体的选择器
3. 指定的属性会覆盖继承的属性

等等.级联解决了任何冲突情况.它是应用属性的顺序.

(更新)特异性是用于确定级联中的选择器优先级的计算.当两个选择器应用于同一元素时,具有较高特异性的元素优先.

1. 内联样式具有非常高的特异性(1000)
2. ID具有特异性 100
3. 类/属性和伪类添加 10
4. 元素和伪元素添加 1

将选择器链中的所有部分相加以确定总体特异性.如果是平局,则最后一个选择器优先.

当然,这带来了各种边缘案例和警告.无论有多少,一个类总是会覆盖普通元素.更有针对性的选择器优先于父选择器的继承属性.如果有人使用!important,你可以扔掉所有的计算- 胜过一切.