一、CSS样式

继承：子元素继承父类的样式；
优先级：是指不用的样式权重的比较；
层叠：不同的样式可以相互调用使用或覆盖样式；

CSS选择器分类

标签选择器（body、div、ul、li）;
类选择器（class=”mystyle”）;
ID选择器(id=”myid”);
全局选择器（*）
组合选择器（#heads.header_log）,当使用组合选择器时每一个标签选择器或类选择器需要用空格分开；
后代选择器（#head.nav ul li ）,从父类的子类选择器；
群组选择器（div,span,img{border:0;}）具有相同样式标签分组显示;
继承选择器（div p）注意选择器要空格分开;
伪类选择器 a元素不同状态 link visted active hover;
子选择（div>p）必须大有大于号；
属性选择（a [target=’_blank’]）;
css相邻兄弟选择器（h1+p）；
css优先级
两套规则都作用在同一个html元素上，定义属性发生了冲突，css有一套优先级的定义；
不同的优先级
1、属性后加入！important会覆盖页面任何定义的元素样式；
2、行业样式作为行内style写在元素内的样式；
3、id选择器；
4、类选择器；
5、标签选择器；
6、通配符选择器；
7、浏览器自定义或继承；
总结：!important>行内样式>选择器>类选择器>标签选择器>通配符选择器>浏览器自定义的样式；
```
<!DOCTYPE html>
<html lang="zh-cn">
<head>    
<meta charset='utf-8' />
<meta http-equiv="refresh" content="4" />
<title>这个14demo </title>
<style>
 div.div1{
 background-color:red;
 width:100px; height: 100px;
 }
 .div1.div2{
  background-color:blue;
  width:200px;height:200px;
 }
</style>
</head>
<body>
<div class="div1 div2"></div>
</body>
</html>
```
div标签采用条规则，有个简单计算，权值不是十进制数字，用数字说明思想；

内联样式表的权值为1000；
ID选择权值为100；
class选择权值10；
html标签选择权值为1；
我们可以做个简单加减法来计算，div+class权值1+11=11，而.div1.div 那么是10+10=20，所以变成蓝色高宽也不同；

CSS三大特性 继承、优先级及层叠

一、CSS样式

CSS选择器分类

css优先级

CSS三大特性继承、优先级及层叠