继承性
作用：给父元素设置的一些属性，子元素也可以使用，这就是我们称之为的继承性。
注意点：
- 并不是所有的属性都可以继承，只有以color/font-/text-/line-开头的属性才能被继承；
- 在css的继承中，不仅是只 有儿子可以继承，只要是后代都可以继承；
- css继承中的特殊性：
- a标签的字体颜色和下划线是不能继承的；
- h 标签的文字大小是不能继承的；
应用场景：
一般用于设置网页上的一些共性信息，例如网页的颜色，字体，大小等。
<html lang="en">
<head>
<meta charset="UTF-8">
<title>24-CSS三大特性之继承性</title>
<style>
div{
color: red;
text-decoration: none;
font-size: 30px;
}
</style>
</head>
<body>
<div>
<p>我是段落</p>
</div>
<div>
<ul>
<li>
<p>我是段落</p>
</li>
</ul>
</div>
<div>
<a href="#">我是超链接</a>
</div>
<div>
<h1>我是大标题</h1>
</div>
</body>
</html>
层叠性
1.作用：层叠性就是CSS(Cascading StyleSheet)处理冲突属性的一种属性。
注意点：
层叠性只有在多个选择器选中“同一标签”并且设置了“相同属性”，才会出现层叠性。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>25-CSS三大特性之层叠性</title>
<style>
p{
color: red;
}
.para{
color: blue;
}
</style>
</head>
<body>
<p id="identity" class="para">我是段落</p>
</body>
</html>
优先级
作用：当多个选择器选中同一个标签，并且对同一个标签设置相同属性，如何层叠就由优先级来确定。
判断方式：
- 间接选中即继承；
如果是间接选中，哪个离目标标签近就按照哪个标签的属性继承。 - 相同的选择器（直接选中）；
如果都是直接选中，并且都是同类型的选择器，哪个在后面就继承哪个标签的属性。 - 不同选择器（直接选中）；
如果都是直接选中，并且不是相同类型的选择器，就会按照选择器的优先级来层叠。
id>class>标签>通配符>继承>浏览器默认 - ！important：
作用：用于提升某个直接选中标签的选择器中的某个属性的优先级的，可以被指定的的属性优先级最高。
注意点：
- important只能用于直接选中，不能用于间接选中；
- 通配符选择器选中的标签也是直接选中的；
- important只能提升被指定的属性优先级，其它属性不会被提升；
- important必须写在分号之前，且前面的！不能省略。
优先级的权重
作用：当多个选择器混合在一起使用时，我们可以利用权重判断哪个的优先级最高。
计算规则：
- 首先计算选择器中的id个数，id数越多优先级越高；
- id个数相同时比较class个数，class个数最多的优先级最高；
- 如果class的个数也相同，那么再比较标签的个数，标签个数较多的优先级较高；
4.如果id，class及标签的个数均相同，谁在后面优先级较高。
注意点：
1.以上判断规则是基于直接选中的选择器之间权重比较；
- 如果是直接选中和间接选中同时存在，直接选中的优先级比较高。
网友评论