css三大特性

三大特性:继承性 层叠性 优先级

继承性

子承父业

子元素可以继承父元素的某些样式.

以下属性都可以继承
color: red;
font-style: italic;
font-weight: 700;
font-size: 14px;
font-family: '黑体';
text-indent: 2em;
text-align: center;
line-height: 200px;

控制文字的属性都能继承,不是控制文字的都不能继承.

    ul {
            /* 去除li标签默认的小圆点 */
            list-style: none;
        }

继承失效:

如果元素有浏览器默认样式，此时继承性依然存在，但是优先显示浏览器的默认样式

0. a标签的color会继承失效

其实color属性继承下来了，但是被浏览器默认设置的样式给覆盖掉了

2. h系列标签的font-size会继承失效

其实font-size属性继承下来了，但是被浏览器默认设置的样式给覆盖掉了

3. div的高度不能继承，但是宽度有类似于继承的效果

宽度属性不能继承，但是div有独占一行的特性

层叠性

相同的选择器设置相同的样式才会有层叠性.

优先级

不同选择器具有不同的优先级，优先级高的选择器样式会覆盖优先级低选择器样式

继承<通配符<标签选择器<类选择器<id选择器<行内样式<!important

!important不能提升继承的优先级,只要是继承优先级最低.

如果不是继承,!important天下第一,实际开发不建议使用!important

权重叠加

如果是复合选择器，此时需要通过权重叠加计算方法，判断最终哪个选择器优先级最高会生效

权重叠加公式:

权重叠加计算公式：（每一级之间不存在进位）

行内样式个数 id选择器个数 类选择器个数 标签选择器个数

0 0 0 0

简单理解

行内样式个数:1000 ---1000

id选择器个数:0100 --100

类选择器个数:0010 ---10

标签选择器个数 :0001 ---1

如果优先级相同,则比较层叠性,谁的样式在后面,谁说了算.

!important如果不是继承,权重最高 天下第一