css - CSS 中 : 和::的区别

Question

这个问题在这里已经有了答案:





What is the difference between :before and ::before?

(5 个回答)


7年前关闭。




CSS 中 : 和::之间到底有什么区别？
例如，我看到的 CSS 代码如下:

.example:before{
   content:'just one';
}

和

.example2::before{
   content:'here two';
}

有什么不同？什么是最佳实践？

Answer 1

Pseudo-classes

The pseudo-class concept is introduced to permit selection based on information that lies outside of the document tree or that cannot be expressed using the other simple selectors.

A pseudo-class always consists of a "colon" (:) followed by the name of the pseudo-class and optionally by a value between parentheses.

引用: http://www.w3.org/TR/css3-selectors/#pseudo-classes

Pseudo-elements

Pseudo-elements create abstractions about the document tree beyond those specified by the document language. For instance, document languages do not offer mechanisms to access the first letter or first line of an element's content. Pseudo-elements allow authors to refer to this otherwise inaccessible information. Pseudo-elements may also provide authors a way to refer to content that does not exist in the source document (e.g., the ::before and ::after pseudo-elements give access to generated content).

A pseudo-element is made of two colons (::) followed by the name of the pseudo-element.

引用: http://www.w3.org/TR/css3-selectors/#pseudo-elements
我们过去通常只对所有内容使用一个冒号，但现在最好的做法是遵循 W3C 的指导方针，尽管我要添加一个警告，即您要确保您所支持的浏览器在开始批量更改之前了解语法你的样式表。