七、css三大特性

一）继承性

1.特性:

子元素会自动拥有父元素的某些css属性；继具有传递性，一代传一代(子承父业)

2.可以继承的常见属性:

*color *font- style 、 font - weight 、 font - size 、 font - family *text - indent 、 text - align *line - height

3.不可以被继承的属性有：

background-color

4.注意点:

可以通过调试工具判断样式是否可以继承

5.强制继承：

也叫做显式继承，是指将css属性值设置为inherit

6.拓展继承失效的特殊情况：

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

*a标签的 color 会继承失效 *h系列标签的 font — size 会继承失效 *div 的高度不能继承,但是宽度有类似于继承的效果

7.属性值计算过程简介

二）层叠性（声明冲突）

1.声明冲突产生的原因：

一个元素的外观可能由多个规则影响，规则之间的属性相同，但取值不同，这就是声明冲突；

2.什么是层叠：层叠是一种机制，用于解决css声明冲突。

3.层叠的过程：

1)比较优先级

（作者样式表>浏览器默认样式>用户样式表）&（重要声明>普通声明）

2)比较特殊性（权重叠加计算）

在比较特殊性时，每一个冲突的声明会生成4个数字分组（abcd），以比较特殊性a越大、特殊性越高，若a相同，比较b，b越大，特殊性越高，依次类推......

a:若声明是行内样式，则为1，否则为0；

b:规则中id选择器的个数；

c:规则中类选择器、伪类选择器和属性选择器的个数；

d:规则中元素选择器、伪类选择器的个数；

	嵌入	id	class	元素
	a	b	c	d
style	1	0	0	0
id	0	1	0	0
class\属性、伪类	0	0	1	0
元素、伪元素	0	0	0	1
通配符	0	0	0	0
！important	0	0	0	0

每一个声明都有一个特殊性（specificity），当冲突发生时，特殊性高的会保留，低的会被淘汰；一个声明的特殊性，取决于规则适用范围的大小，规则适用范围越大，特殊性越低，适用范围越小，特殊性越高。

important>行内样式>ID选择器>类选择器(伪类选择器)>元素选择器（伪元素）>通配符选择器

特性:

1.给同一个标签设置不同的样式——此时样式会层叠叠加——会共同作用在标签上 2.给同一个标签设置相同的样式——此时样式会层叠覆盖——最终写在最后的样式会生效

注意点:

1.当样式冲突时,只有当选择器优先级相同时,才能通过层叠性判断结果

三）优先级

特性:

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

优先级公式: 继承<通配符选择器<标签选择器<类选择器< id 选择器<行内样式< limportant

注意点: 1.limportant写在属性值的后面,分号的前面! 2.limportant不能提升继承的优先级,只要是继承优先级最低! 3.实际开发中不建议使用! important