伪元素

伪类与伪元素

1
2
3
4
伪类用于向某些选择器添加特殊的效果。
伪类效果可以通过添加一个实际的类来达到
伪元素用于将特殊的效果添加到某些选择器或者通过添加选择器来实现效果。
伪元素效果则需要通过添加一个实际的元素才能达到

伪类

1
2
3
4
:active  	#向被激活的元素添加样式。
:hover #当鼠标悬浮在元素上方时,向元素添加样式。
:link #向未被访问的链接添加样式。
:visited #向已被访问的链接添加样式。

伪类的使用循序::link -> :visited -> :hover ->:active

伪元素

1
2
::before	#在元素之前添加内容。
::after #在元素之后添加内容。

这两个伪元素相当于添加span标签
content:”” 伪元素before,after下特有的属性,必须添加,用于在 CSS 渲染中向元素逻辑上的头部或尾部添加内容。
注意这些添加不会改变文档内容,不会出现在 DOM 中,不可复制. “”中可以是添加的文本内容,可以是空。

1
2
3
4
::first-letter	#向文本的第一个字母添加特殊样式。	
::first-line #向文本的首行添加特殊样式。
::selection #选择器匹配被用户选取的选取是部分,进行样式操作。
::selection 选择器只能应用少量 CSS 属性:color、background、cursor 以及 outline。