CSS的三大特性总结

CSS的三大特性分别是继承性、层叠性和优先级,下面将对这三个特性进行解说。

1.继承性

继承性:当给父元素设置一些属性时,他的子元素可以使用,这种称为继承性。例如

CSS的三大特性总结_第1张图片

 给div标签设置样式,他的子元素和孙元素都继承了父元素的样式,在CSS的继承中不仅仅是儿子可以继承, 只要是后代都可以继承

CSS的三大特性总结_第2张图片

 值得注意的是:并不是所有的属性都可以继承, 只有以color/font-/text-/line-开头的属性才可以继承,继承性中有两个特殊的地方:
1. a标签的文字颜色和下划线是不能继承的,当做子元素;
2 h标签的文字大小是不能继承的,在做子元素;

2.层叠性

层叠性就是CSS处理冲突的一种能力,只有在多个选择器选中"同一个标签", 然后又设置了"相同的属性", 才会发生层叠性 ,例如:

CSS的三大特性总结_第3张图片

 3.优先级

优先级:当多个选择器选中同一个标签, 并且给同一个标签设置相同的属性时, 如何层叠就由优先级来确定。判断优先级有三种方式:1.间接选中也指继承, ​ 如果是间接选中, 那么就是谁离目标标签比较近就听谁的;

2相同选择器(直接选中) ​ 如果都是直接选中, 并且都是同类型的选择器, 那么就是谁写在后面就听谁的

CSS的三大特性总结_第4张图片

CSS的三大特性总结_第5张图片

3不同选择器(直接选中) ​ 如果都是直接选中, 并且不是相同类型的选择器, 那么就会按照选择器的优先级来层叠;

优先级权重如下:

1.!important 优先级别最高

  2.style属性 特征值1000

  3.id标签选择器 特征值100

  4.class类选择器/伪类 特征值10

  5.标签选择器 特征值1

  6.通配符 特征值0

CSS的三大特性总结_第6张图片

 今天的分享就到这里了,如果写的有问题欢迎指出~~

你可能感兴趣的:(CSS,css,前端,html5)