CSS3 浏览器支持情况
网址查询：caniuse.com
CSS3的伪类选择器（一）
动态伪类选器
a:link{} a:visited{} a:hover{} a:active{}
UI元素状态伪类选择器
html部分：
<input type="text"> <input type="text" disable> // disable 是状态
CSS部分：（根据状态确定样式）
input :enable{} input:disable{}
CSS3的伪类选择器（二）
结构伪类选择器
html部分：
<ul> <li a href=""></li> <li a href=""></li> <li a href=""></li> <li a href=""></li> <li a href=""></li> <li a href=""></li> <li a href=""></li> </ul>
css部分
li:fist-child{} 元素的第一个子元素选中 li:last-child{} 元素的最后一个子元素选中 li:nth-child(****){} 选中顺序从左往右 li:nth-child(2n){} 元素的第偶数个子元素选中 li:nth-child(2n+1){} 元素的第奇数个子元素选中 li:nth-child(n+5){} 元素从第5个子元素开始选中 li:nth-child(4n+1){} 元素每4个元素选中 li:nth-last-child(){} 选中顺序从右往左 li:nth-of-type(){} 限定是li标签的子元素 从前往后 li:nth-last-of-type{} 从后往前 li:fist-of-type{} 限定是第一个li标签子元素 li:last-of-type{} 限定是最后一个li标签子元素 li:only-child{} 选择的元素是它父元素只有一个子元素 li:only-of-type{} 选择的元素是它父元素只有一个子元素，但是限制子元素的标签类型为li li:empty{} 选中的li标签父元素是空的
伪元素
html:
<div class="demo"> <p></p> </div>
css:
.demo::first-letter{} 文本段落首字 .demo::first-line{} 文本段落首行 .demo::before{ //demo之前 content:; //伪元素的content属性必须要有，不设置也要有，留空 } .demo::after{ //demo之后 content:; }
