# CSS三大特性
继承、 优先级和层叠
继承： 即子类元素继承父类的样式;
优先级： 是指不同类别样式的权重比较;
层叠： 是说当数量相同时，通过层叠(后者覆盖前者)的样式。
# css选择符分类
# css选择符(css选择器)
1.标签选择器(如：body,div,p,ul,li)
2.类选择器(如：class="head",class="head_logo")
3.ID选择器(如：id="name",id="name_txt")
4.全局选择器(如：*号)
5.组合选择器(如：.head.head_logo,注意两选择器用空格键分开)
6.后代选择器 (如：#head .nav ul li 从父集到子孙集的选择器)
7.群组选择器 div,span,img {color:Red} 即具有相同样式的标签分组显示
8.继承选择器(如：divp,注意两选择器用空格键分开)
9.伪类选择器(如：就是链接样式,a元素的伪类，4种不同的状态：link、visited、active、hover。)
10.字符串匹配的属性选择符(^$*三种，分别对应开始、结尾、包含)
11.子选择器 (如：div>p ,带大于号>)
12.CSS 相邻兄弟选择器器(如：h1+p,带加号+)
# css优先级1
当两个规则都作用到了同一个html元素上时，如果定义的属性有冲突，那么应该用谁的值的，CSS有一套优先级的定义：
1. 在属性后面使用 !important 会覆盖页面内任何位置定义的元素样式。
2. 作为style属性写在元素内的样式
3. id选择器
4. 类选择器
5. 标签选择器
6. 通配符选择器
7. 浏览器自定义或继承
**总结排序：**
!important > 行内样式>ID选择器 > 类选择器 > 标签 > 通配符 > 继承 >览器默认属性同一级别
同一级别中后写的会覆盖先写的样式上面的级别还是很容易看懂的，但是有时候有些规则是多个级别的组合
# CSS优先级2
由四个级别和各级别的出现次数决定的。
**四个级别分别为**：行内选择符、ID选择符、类别选择符、元素选择符。
**优先级的算法**：
每个规则对应一个初始"四位数"：0、0、0、0
若是 **行内选择符**，则加1、0、0、0
若是 **ID选择符**，则加0、1、0、0
若是 **类选择符/属性选择符/伪类选择符**，则分别加0、0、1、0
若是 **元素选择符/伪元素选择符**，则分别加0、0、0、1
**算法**：将每条规则中，选择符对应的数相加后得到的”四位数“，从左到右进行比较，大的优先级越高。
或者这样理解，**CSS选择器及权重**：
ID选择器0，1，0，0。百位贡献
属性选择器0，0，1，0。十位贡献
伪类选择器0，0，1，0。十位贡献
Class选择器0，0，1，0。十位贡献
标签选择器0，0，0，1。个位贡献
伪元素选择器0，0，0，1。个位贡献
通配符(*)、子选择器（>）、相邻选择器（+）为0000。无贡献
**继承所得的样式没有权重（比通配符还低）简洁、高效的css**
所谓高效就是让浏览器查找更少的元素标签来确定匹配的style元素。
# 注意
- 不要再ID选择器前使用标签名
解释：ID选择是唯一的，加上标签名相当于画蛇添足了，没必要。
- 不要在类选择器前使用标签名
解释：如果没有相同的名字出现就是没必要，但是如果存在多个相同名字的类选择器则有必要添加标签名防止混淆如（p.colclass{color：red;} 和 span.colclass{color:red;}
- 尽量少使用层级关系
#divclass p.colclass{color:red;}改为.colclass{color:red;}
- 使用类选择器代替层级关系（如上）