css伪类和伪元素(Pseudo-elements)区别

CSS 伪类 (Pseudo-classes)

W3C:"W3C" 列指示出该属性在哪个 CSS 版本中定义(CSS1 还是 CSS2)。

属性 描述 CSS
:active 向被激活的元素添加样式。 1
:focus 向拥有键盘输入焦点的元素添加样式。 2
:hover 当鼠标悬浮在元素上方时,向元素添加样式。 1
:link 向未被访问的链接添加样式。 1
:visited 向已被访问的链接添加样式。 1
:first-child 向元素的第一个子元素添加样式。 2
:lang 向带有指定 lang 属性的元素添加样式。

伪元素(Pseudo-elements)

W3C:"W3C" 列指示出该属性在哪个 CSS 版本中定义(CSS1 还是 CSS2)。

属性 描述 CSS
:first-letter 向文本的第一个字母添加特殊样式。 1
:first-line 向文本的首行添加特殊样式。 1
:before 在元素之前添加内容。 2
:after 在元素之后添加内容。 2

 演示代码:

p:first-line
  {
  color:#ff0000;
  font-variant:small-caps;
  }

p:first-letter
  {
  color:#ff0000;
  font-size:xx-large;
  }

 "first-line" 伪元素用于向文本的首行设置特殊样式。只能用于块级元素

"first-letter" 伪元素用于向文本的首字母设置特殊样式:

你可能感兴趣的:(css,css伪类,css伪元素)