（一）:enabled选择器
在Web的表单中，有些表单元素有可用（":enabled"）和不可用（“：disabled”）状态，比如输入框，密码框，复选框等。在默认情况之下，这些表单元素都处在可用状态。那么我们可以通过伪类选择器“：enabled”对这些表单元素设置样式。
（二）：disabled选择器
“:disabled”选择器刚好与“:enabled”选择器相反，用来选择不可用表单元素。要正常使用“:disabled”选择器，需要在表单元素的HTML中设置“disabled”属性。
（三）:checked选择器
在表单元素中，单选按钮和复选按钮都具有选中和未选中状态。（大家都知道，要覆写这两个按钮默认样式比较困难）。在CSS3中，我们可以通过状态选择器“:checked”配合其他标签实现自定义样式。而“:checked”表示的是选中状态。
（四）::selection选择器
"::selection"伪元素是用来匹配突出显示的文本（用鼠标选择文本时的文本）。浏览器默认情况下，用鼠标选择网页文本是以“深蓝的背景，白色的字体”显示地，效果如下图所示:
从上图中可以看出，用鼠标选中“专注IT、互联网技术”、“纯干货、学以致用”、“没错、这是免费的”这三行文本中，默认显示样式为：蓝色背景、白色文本。
有的时候设计要求,不使用上图那种浏览器默认的突出文本效果，需要一个与众不同的效果，此时“::selection”伪元素就非常的实用。不过在Firefox浏览器还需要添加前缀。
Firefox支持替代的::-moz-selection.
（五）:read-only选择器
“:read-only”伪类选择器用来指定处于只读状态元素的样式。简单点理解就是，元素中设置了“readonly=’readonly’”
（六）：read-write选择器
“:read-write”选择器刚好与“:read-only”选择器相反，主要用来指定当元素处于非只读状态时的样式。
注意：（五）（六）都需要再写:-moz-read-only,:moz-read-write
(七)::before和::after
::before和::after这两个主要用来给元素的前面或后面插入内容，这两个常和"content"配合使用，使用的场景最多的就是清除浮动。
还可以结合渐变元素给导航栏标题间添加分隔线
一些实例：
http://blog.dimpurr.com/css-before-after/
网友评论