伪元素和伪类的区别 | _island Record

📁 标签

CSS

伪元素和伪类的区别

伪元素

在一个元素的前/后入一个额外的元素，这些元素并不会在HTML中生成，只在外部显示可见，也不能在源代码中找到它们。所以称之为伪元素。

html

<body>
    <div class="el"></div>
</body>

<style>
    .el:before{
        content:'我是伪元素';
        color:red;
    }
</style>

preview

伪类

将带有特殊效果的关键字添加到样式选择器中，例如常见的hover，active，first-child...

css

.el:hover{
    color:red;
}

preview