CSS 中一个冒号与两个冒号

作者:vkvi 来源:千一网络(原创) 日期:2021-7-9

一个冒号是伪类,比如::link、:visited、:hover、:active、:focus、:lang、:first-child……

两个冒号是伪元素,比如:::first-line、::first-letter、::before、::after

  • ::first-letter,伪元素的样式将应用于元素文本的第一个字(母)。

  • ::first-line,伪元素的样式将应用于元素文本的第一行。

  • ::before,利用 content 属性在元素内容的最前面添加新内容。

  • ::after,利用 content 属性在元素内容的最后面添加新内容。

  • 好像 li 自带的 ::marker 也是。

注意:想使用 ::after::after 实现追加 2 次内容,是不能实现的。

注意:first-child 是伪类,类似还有 :last-child、:last-of-type、:only-of-type、:only-child、:nth-child(n)、:nth-last-child(n)、:nth-of-type(n)、:nth-last-of-type(n)、:target、:target、:not(选择符)、:enabled、:disabled、:checked。

CSS 2.0 中,伪类、伪元素都是一个冒号

CSS 3.0 中,伪类一个冒号、伪元素两个冒号

考虑到兼容性,所以伪元素用一个冒号,也是认得到的



相关文章