上一次讲了一些选择器，今天我们讲一下剩下的选择器以及一些布局。
伪类选择器
伪元素选择器
：first-letter 选择文本的首字母
：first-line 选择文本的首行
：after 在元素前面添加内容
：before 在元素后面添加内容
选择器总结
什么是选择器？
选择器：描述后面的样式施加到哪些目标，或者根据某个依据来选择应用的样式。根据选择依据的不同，就产生了不同的选择器
1、元素选择器
Div{background-color:red}
2、id选择器
根据元素的id属性来选择
书写格式是：#idname{xxxxx}
#username(font-size:25px)
3、类选择器
根据元素的class属性来选择
书写格式是：.Classname{xxxxxx}
.passwd{font-size:26px}
4、属性选择器
根据属性的特征来选择应用样式的目标，从这个意义上讲，它包含了id选择器和类选择器
[title]:选择设置了title属性的元素
[title=”tt”]:选择title属性等于“tt”的元素
[title^=”tt”]:选择title属性以“tt”开头的元素
[title$=“tt”]:选择title属性以“tt”结尾的元素
[title~=”tt”]:选择title属性包含完整单词“tt”的元素
[title*=”tt”]:选择titlt属性包含“tt”的元素
5.关系选择器
根据元素间的家族关系来选择目标
这些细节我们有可能记不住，没有关系
忘记的时候看一下
你能够认识它就行
6.伪元素、伪类选择器
伪元素：其效果等同于增加一个元素，所以称之为伪元素
伪类：其效果等同于增加一个类，所有称之为伪类
7.组合选择器
多个选择器如果想应用同一个样式，可以用逗号隔开
布局
文档流
所谓文档流就是从左向右，从上到下的布局
定位
默认的文档流很多时候不能满足我们的要求，那么我们就需要更丰富的布局手段，这个时候就需要定位
定位方式有 static、fixed、relaticve、absolute
Static静态定位（默认）
无定位，元素正常出现在（文档流）中
不受left、right、top、bottom的影响
Relative 相对定位
absolute 绝对定位
被绝对定位的块会被单独的从网页摘出来
Fixed 固定定位
z-index
为了处理样式重叠事件，我们需要用到z-index
数值越大，等级越高（999）
定位总结
(1) 标准文档流按照从左到右，由上到下的方式排列元素<如果想要改变默认的布局方式，就需要用到relative,(Absolute,fixed等定位方
(2) relative 是相对于原来的位置进行偏移
(3) absolute 是相对于它的父容器(上一级)进行偏移
但是它的父容器也必须不是默认定位(static)，否则的话会一直顶到网页的最顶部
(4) fixed是相对于整个页面进行偏移
（5）relative不会从标准文档流里脱离，但是absolute和Fixed是都会从文档流里脱离出来
浮动
通过设置float使得元素从原本的文档流里脱离出来
感觉像浮在原本的文档流上面，所以叫它浮动
案列：
代码实现：
我们做这个案例的时候，会遇到这种情况：
这是因为div5被浮动的div2，div3，div4覆盖了，但还是可以通过
调试工具查看到
那么怎样能让它正常显示呢
在div4后面加上一个clear
.clear{ clear:left;}