当前位置:  开发笔记 > 前端 > 正文

伪类和伪元素有什么区别?

如何解决《伪类和伪元素有什么区别?》经验,为你挑选了2个好方法。

div::after {}和之间有什么不同div:after {}?我们什么时候需要使用:::

双冒号和单冒号表示法用于区分伪类和伪元素.

上述陈述的实际含义是什么?



1> Bas van Dijk..:

来自https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Pseudo-classes_and_pseudo-elements

伪类:

CSS伪类是一个关键字,以冒号(:)开头,添加到选择器的末尾以指定要为所选元素设置样式,并且仅当它们处于特定状态时.例如,您可能希望仅在鼠标指针悬停元素时设置样式,或者在禁用或选中它时使用复选框,或者在DOM树中将其作为父元素的第一个子元素.

例子:

:活性

:检查

:第n个孩子()

:第一

:徘徊

伪元素::

伪元素非常类似伪类,但它们有差异.它们是关键字,这次前面有两个冒号(::),可以添加到选择器的末尾以选择元素的某个部分.

例子:

::后

::之前

::第一个字母

::第一行

::选择

::背景


也许值得注意的是,在实践中:: before用作:before和:: after用作:之后因浏览器兼容性.两者都是伪元素,但可能看起来像伪类.如果您阅读CSS代码,这可能会令人困惑.

2> Ehsan..:

伪类: 它由浏览器自动应用,具体取决于元素的位置或其交互状态.

例如 :

E:hover 当光标悬停在E上时,匹配E类型的元素.

伪元素: 它根据内容在HTML层次结构中的位置将样式应用于内容.

例如 :

E::first-letter 这将样式应用于块级元素E内第一行的第一个字母.

所以,

CSS3选择器规范为伪元素添加前缀,而不是一个冒号.所以,:第一个字母变成::第一个字母,第一个字母变成::第一个字母.IE 8及更早版本不理解双冒号前缀,因此您需要使用单冒号版本以避免旧版浏览器中的样式中断.

推荐阅读
夏晶阳--艺术
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有