css伪类 伪元素

css伪元素

selector:pseudo-element {property:value;}

:first-line
文本首行设置特殊的样式

:first-letter
文本首字母设置特殊样式

:before
在元素的内容前面插入新内容

:after
在元素的内容之后插入新的内容

cc伪类

selector : pseudo-class {property: value}

a:link
未访问的连接

a:visited
已经访问过的连接

a:hover
鼠标移动到连接上

a:active
选定的连接

p:first-child
{
background-color:yellow;
}
选择属于其父元素的首个子元素的每个p元素

p:last-child
指定属于其父元素的最后一个子元素的 p 元素的背景色

:root
文档的根元素

:empty
没有子元素的元素

:target
当前活动的目标元素

:not(selector)
选择除 selector 元素之外的元素

:enabled
选择可用的表单元素

:disable
选择禁用的表单元素

:checked
选择被选择的表单元素

:nth-child(n)
匹配父元素下指定的子元素，在所有子元素中排序n

:nth-last-child
匹配父元素下指定的子元素，在所有子元素中排序n，从后往前数

:nth-child(odd)
匹配父元素下指定的子元素，在所有子元素中排序为偶数

:nth-child(even)
匹配父元素下指定的子元素，在所有子元素中排序为奇数

p:only-child
规定属于其父元素的唯一子元素的每个 p 元素：

::after ::before与:after :before区别

单冒号用于css3伪类
双冒号用于css3伪元素

伪元素和伪类之所以这么容易混淆，是因为他们的效果类似而且写法相仿，但实际上 css3 为了区分两者，已经明确规定了伪类用一个冒号来表示，而伪元素则用两个冒号来表示。但因为兼容性的问题，所以现在大部分还是统一的单冒号，但是抛开兼容性的问题，我们在书写时应该尽可能养成好习惯，区分两者。

如果你的网站只需要兼容webkit、firefox、opera等浏览器，建议对于伪元素采用双冒号的写法，如果不得不兼容IE浏览器，还是用CSS2的单冒号写法比较安全。