CSS content 属性

在 CSS 中，content 属性用于在伪元素中插入内容。它通常与 ::before 和 ::after 伪元素一起使用，用于在元素的前后插入内容，从而实现一些特殊的效果。

语法

selector::before {
  content: value;
}

selector::after {
  content: value;
}

值

• normal：默认值，不显示任何内容。
• none：不显示任何内容，类似于 display: none。
• <string>：插入指定的文本内容。
• <url>：插入指定的图像。
• attr()：插入指定属性的值。

示例

插入文本内容

p::before {
  content: ">> ";
}

插入图像

div::after {
  content: url('image.png');
}

插入属性值

a::after {
  content: attr(href);
}

注意事项

• content 属性只能应用于伪元素 ::before 和 ::after。
• 插入的内容不会被屏幕阅读器读取，所以不要仅依赖于 content 属性来提供重要信息。

以上就是关于 CSS 属性 content 的介绍，希望对你有所帮助。