伪类(:单冒号)和伪元素(双冒号)

桃扇骨 2022-03-02 15:46 384阅读 0赞

css2的规定为单冒号表示，而css3已经明确表示伪类使用单冒号，伪元素使用双冒号，本次所有测试双冒号

伪类选择元素基于的是当前元素处于的状态，或者说元素当前所具有的特性，而不是元素的id、class、属性等静态的标志。由于状态是动态变化的，所以一个元素达到一个特定状态时，它可能得到一个伪类的样式；当状态改变时，它又会失去这个样式。由此可以看出，它的功能和class有些类似，但它是基于文档之外的抽象，所以叫伪类。

与伪类针对特殊状态的元素不同的是，伪元素是对元素中的特定内容进行操作，它所操作的层次比伪类更深了一层，也因此它的动态性比伪类要低得多。实际上，设计伪元素的目的就是去选取诸如元素内容第一个字（母）、第一行，选取某些内容前面或后面这种普通的选择器无法完成的工作。它控制的内容实际上和元素是相同的，但是它本身只是基于元素的抽象，并不存在于文档中，所以叫伪元素。

简单理解，伪元素是可以设置content属性的，类似于标签，但是伪类只能设置样式不能设置内容。

伪类:
a:link {color: #FF0000} /* 未访问的链接 /
a:visited {color: #00FF00} / 已访问的链接 /
a:hover {color: #FF00FF} / 鼠标移动到链接上 /
a:active {color: #0000FF} / 选定的链接 */

伪元素:
::after
::before

发表评论

表情：
评论列表 （有 0 条评论，384人围观）

还没有评论，来说两句吧...

相关阅读

    相关 CSS的伪类和伪元素

    定义 伪类: CSS 伪类 是添加到选择器的关键字，指定要选择的元素的特殊状态。 例如，:hover 可被用于在用户将鼠标悬停在按钮上时改变按钮的颜色。

    电玩女神电玩女神/ 0 赞/ 234 阅读

    相关 css 伪类、伪元素

    一、伪类、伪元素的共同点 1. 伪类、伪元素存在的原因： css引入伪类和伪元素概念是为了格式化文档树以外的信息。也就是说，伪类和伪元素是用来修饰不在文档树中的部分，比

    青旅半醒青旅半醒/ 0 赞/ 256 阅读

    相关 CSS伪类和伪元素

    为什么要引入伪类与伪元素？ css引入伪类和伪元素概念是为了格式化文档树以外的信息。也就是说，伪类和伪元素是用来修饰不在文档树中的部分，比如，一句话中的第一个字母，或是列

    ゝ一世哀愁。ゝ一世哀愁。/ 0 赞/ 316 阅读

    相关 伪类与伪元素

    首先，阅读 `w3c` 对两者的定义： `CSS` 伪类用于向某些选择器添加特殊的效果。 `CSS` 伪元素用于将特殊的效果添加到某些选择器。 可以明确两点，第

    一时失言乱红尘一时失言乱红尘/ 0 赞/ 317 阅读

    相关 伪类(:单冒号)和伪元素(双冒号)

    css2的规定为单冒号表示，而css3已经明确表示伪类使用单冒号，伪元素使用双冒号，本次所有测试双冒号 伪类选择元素基于的是当前元素处于的状态，或者说元素当前所具有的特性，而

    桃扇骨桃扇骨/ 0 赞/ 385 阅读

    相关 伪类与伪元素

    一、伪类 伪类包含两种：状态伪类（UI 伪类）和结构性伪类。 (1)状态伪类是基于元素当前状态进行选择的。 在与用户的交互过程中元素的状态是动态变化的，因此该元素

    野性酷女野性酷女/ 0 赞/ 447 阅读