css布局级层级关系--2017.11.13

一。页面引用css的方式
1.内联样式

2.内部样式

3.外部样式
一种：


二种：

二。文件路径
“./”代表当前所在文件夹下的
“../”代表上一级目录
“/”一般放到服务下 代表域名下的某路径 所以一般使用相对路径

---

css: 页面
文字相关
背景相关
布局相关
响应相关
动画相关
变形相关
css:选择器
1.基础选择器：“*”通用选择器：匹配页面所有元素
“ID”id选择器 匹配页面对应的ID元素
“class”类选择器匹配页面对应的class类下的元素
“element”标签选择器
2.组合选择器：‘E,F’并列选择器
‘E F’后代选择器 E下的所有F后代（子孙）
‘E>F’子元素选择器 E下的直接后代（直限儿子）
#b+#c 是 #b 元素之后紧挨着#b的 #c
#b~#c 是 #b 元素之后同级的 #c
‘ef’e和f之间没有空格，没有任何符合 代表既有e又有f 例如"class='a active'" 一般用.a.active 中间无空格
3.属性选择器

---

伪类选择器：用于向某些选择器添加特殊的效果。
.child:first-child 匹配.child所对应的父元素下第一个子元素
.child:first-of-type 匹配.child所对应的父元素下同种类型的第一个子元素
.child:nfn-of-type(2) 同种类型下的第二个选择器 一般2n代表偶数，2n+1代表奇数
伪元素选择器：用于创建一些不在文档树的元素，并为其添加样式

---

选择器的优先级：
1.样式后面加!important的 权重最高
2.style属性也在标签里的内联样式
3.id选择器
4.类选择器
5.伪类选择器
5.属性选择器
7.标签选择器
8.通配符选择器
9.浏览器自定义

---

合理的抽出一些通用样式 ，但具体的某个区域加样式要去针对某个选择器去写
在CSS中，如果对于相同元素有针对不同条件的定义，宜将最一般的条件放在最上面，
并依次向下，保证最下面的是最特殊的条件。这样，浏览器在显示元素时，
才会从特殊到一般、逐级向上验证条件，才会使你的每一个CSS语句都起到效果。