{site_name}

{site_name}

🌜 搜索

CSS3 伪元素(pseudo-elements)是用于向 HTML 元素添加额

前端 𝄐 0
css3伪元素有哪些,css伪元素是什么意思,css伪元素选择器有哪些,html 伪元素,css伪元素和伪类区别,css伪元素的作用
CSS3 伪元素(pseudo-elements)是用于向 HTML 元素添加额外的样式的一种方式,它们不是实际的 HTML 元素,而是由 CSS 创建的虚拟元素。伪元素通常用于为文本或特定的 HTML 元素添加修饰性的效果。

在 CSS3 中,伪元素以双冒号(::)作为前缀,它们可以被应用到任何具有 content 属性的元素上。下面是几个常见的 CSS3 伪元素及其示例:

1. ::before:在元素内容之前插入一个元素。

div::before {
content: "前缀";
color: #f00;
}


2. ::after:在元素内容之后插入一个元素。

div::after {
content: "后缀";
color: #00f;
}


3. ::first-letter:选中元素的第一个字母。

p::first-letter {
font-size: 2em;
font-weight: bold;
}


4. ::first-line:选中元素的第一行。

p::first-line {
font-size: 1.5em;
color: #f00;
}


5. ::selection:选中用户选择的文本部分。

::-moz-selection {
background-color: #ffc;
color: #000;
}

::selection {
background-color: #ffc;
color: #000;
}