CSS核心原理

1.优先原则：

后解析的内容，会覆盖掉之前解析的内容；

同一个选择器：文件执行从上往下，后面的样式会覆盖前面的；

如下例中color最终为粉色；

div {
color:red;
color:pink;
}

　同一类型的选择器：从上往下，如下例中color最终为绿色；

div {
color:red;
}
div {
color:green;
}

背景颜色最终为绿色，（解析顺序与css文件中的排列有关，从上到下）

<div class="txt2 txt1"></div>　　

.txt1 {
background:red;
}
.txt2 {
background:green;
}　　

不同类型的选择器：先解析低优先级的选择器，后解析高优先级的选择器；（*<标签<class<id）

　因此有冲突时，最终生效的会的高优先级的选择器定义的样式；

外部样式 与 内部样式 ：合并之后一起解析 先外部样式 后内部样式 再从上往下执行

因此有冲突时，最终应用的是内部样式

内联样式 ： 只有外部样式与内部样式解析完成后，才解析内联样式

因此有冲突时，最终应用的是内联样式。

加了 !important 字段：最后解析

因此有冲突时，最终应用的是加了 !important 字段的样式。　

2.继承原则：

嵌套里面的标签会拥有外部标签的某些样式，即子元素会继承父元素的某些样式

1）与文字 文本 样式有关的，可以被继承，其他不能被继承；

2）对于块级元素，如果宽度未设置，会继承最近父元素的宽度，高度未设置，由内容决定；