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的单冒号写法比较安全。