CSS包含三大特性，分别是层叠性、继承性、优先级。下面我们一起来看看这些特性。
层叠性
层叠性指当一个标签被设置了多个重复的样式时候，并且这些样式具有相同的权重时，CSS会以最后定义的属性的值为准。也就是“后来者居上”原则。
示例：
DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>层叠性title>
<style type="text/css">
div{
width: 30%;
background-color: dodgerblue;
}
div{
background-color: firebrick;
}
style>
head>
<body>
<div>我真的帅div>
body>
html>
只会覆盖相同的属性的不同样式，不会覆盖不相同的属性，不相同属性最后会合并下来。
继承性
继承性是指当子标签没有设置样式时，会继承父标签的样式。
在CSS中，具有继承性的属性有3大类。
(1)文本相关属性：font-family、font-size、font-style、font-weight、font、line- height、text-align、text-indent、word-spacing
(2)列表相关属性：list-style-image、list-style-position、list-style-type、list-style
(3)颜色相关属性：color
DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>继承性title>
<style type="text/css">
div{
width: 30%;
font-size: 70px;
background-color: forestgreen;
color: #ffffff;
}
style>
head>
<body>
<div>
阿巴阿巴阿巴
<p>我真的帅p>
div>
body>
html>
优先级
优先级：!important>行内样式>id选择器>类选择器>标签选择器>通配符>继承
优先级高的规则会忽视层叠性，忽视就近原则来定义样式。比如定义了!important，即使行内样式离得近，最终生效的还是!important标注的属性。
CSS引用方式优先级行内样式 > (外部样式 = 内部样式)
权重权重用于多个选择器混杂来定义样式的时候。
规则：
(1)权重使用四个数字来衡量(x,x,x,x)【CSS2使用三位】
(2)继承的权重为(0,0,0,0)
(3)伪元素权重为(0,0,0,1)
(4)标签选择器的权重为(0,0,0,1)
(5)类、伪类选择器的权重为(0,0,1,0)
(6)id选择器选择器的权重为(0,1,0,0)
(7)行内样式的权重为(1,0,0,0)
(8)!important的权重无限大
计算方式：
(1)多个选择器混杂时，权重之和也是用四个数字来组成，每一位的值为多个选择器四个数字的每位之和
(2)权重之和的数字是不会进位的，再多的标签选择器权重加和也抵不过一个类选择器。
(3)多个选择器之间的顺序是无关的，不影响权重之和。
(4)对于并集选择器来说不是权重的加和，因为理论上它还是独立的，它只相当于将多个选择器的相同内容归于一个并集选择器中，理论上每一个选择器还是独立的。
示例：
DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>权重计算title>
<style type="text/css">
p{
background-color: green;
}
div .p1{
width: 30%;
background-color: blue;
}
style>
head>
<body>
<div>
<p class="p1">我真的帅p>
div>
body>
html>
可以根据上面的计算出权重，再比较。
本节主要学习了CSS特性，最后对其总结。
层叠性
继承性
优先级(权重计算)
833
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
