css content 样式

时间:2023-04-23 19:55:55

CSS content 属性用于在伪元素(pseudo-elements)中插入内容。它只能在伪元素中使用,不能在普通的HTML元素中使用。

该属性的常见用法是在 ::before 或 ::after 伪元素中插入文本或图像。例如:

p::before {
content: "Note: ";
font-weight: bold;
}

上面的代码会在每个 <p> 元素前插入一个加粗的文本“Note: ”。您还可以将 content 属性设置为空字符串或 none,这样伪元素就不会插入任何内容。

除了文本,您还可以在 content 属性中插入特殊字符、Unicode 码点或图像路径。例如:

p::before {
content: "\2022"; /* Unicode 码点,表示一个圆点 */
margin-right: 5px;
color: red;
}

上面的代码会在每个 <p> 元素前插入一个红色的圆点。

相关词 content