◆CSS选择器（补充）
①伪类选择器 格式： 元素：属性｛｝
允许我们格式化不在文档树中的一些条目。向某些元素添加特殊样式
锚伪类
不同方式格式化超级链接<a>元素的四种不同状态;
* a:link 是用在未访问过的链接的选择器
* a:visited 是用在以访问过的链接的选择器
* a:hover 是用在鼠标光标放在其上的链接选择器
* a:active 是用在获得焦点(比如被点击)的链接上的选择器
TIP:在CSS定义中，a:hover必须置于a:link和a:visited之后才有效；a:active必须置于a:hover之后才有效。伪类名称对大小写不敏感。
因为伪类选择器的具体性，使用时有冲突则使用在样式表中最后出现的选择器。记忆 a love or hate
②伪元素选择器 格式： 选择器:属性｛｝
允许我们格式化文档树中没有的一些信息。
在伪元素选择器中被所有浏览器支持的有两种：
* :first-line 用于一个元素的第一行的选择器
用于first-line的属性： font color background word-spacing letter-decoration vertilal-align text-transform line-height clear
* :first-letter 用于一个元素的第一个字母的选择器
用于first-letter的属性： font color background margin padding border word-spacing text-decoration vertilal-align(仅限float为none时) text-transform line-height float clear
* :before/after 在元素之前/后添加内容
◆CSS盒模型
包含：element元素 padding内边距 border边框 margin外边距
* 内边距padding
padding是简写属性 设置值时不能为负值 值的顺序是top上→right右→bottom下→left左
设置时如不全部定义则 top的值影响right和bottom right的值影响left
* 边框border
属性：style width color(默认值为透明色transparent,可以利用这一点来做三角形)
border足够粗 div足够小 并且其他三遍为透明色时transparent即可做出三角形
*外边距margin
margin也是简写属性 除了设置值时可以为负值外，其余的与padding一样
外边距合并时，只显示值最大的值
我们可以利用margin｛0 auto｝来实现元素的水平居中
◆CSS定位positioning
在CSS中一切皆为框
* display属性：none（相当于元素完全不存在，不占用文档的空间） block（显示为块级元素，自动带有换行符） inline（显示为内联元素，没有换行符） inline-block（行内块级元素，建议少用）
* CSS定位机制;普通流（标准流） 浮动 绝对定位
* CSS定位属性: 有四种不同的定位类型
①static 静态定位 也就是没有定位
②relative 相对定位（偏移） 相对于元素原来的位置进行偏移，其位置不会被占用｛position：relative;top:50px;left:50px｝
③absolute 绝对定位（脱离文档流）
《1》元素框从文档流中完全删除，原位置被占据
《2》相对于包含块进行定位，可以是文档中的另一个元素或初始包含块。绝对定位的元素是相对于最近的祖先元素，没有时才是相对于最初的包含块
《3》生成一个块级框，不论原来是块级元素还是行内元素
④fixed固定定位 （脱离文档流） ｛float:left;position:fixed;top:300px;left:0｝多用于来实现侧边栏导航
* CSS浮动float：浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。由于浮动框不在文档的普通流中，所以文档的普通流中的块框表现得就像浮动框不存在一样。它的属性：left right none
* CSS clear 实现图像的左右不出现浮动 属性：left right both