如何在CSS中添加标签？CSS { content: “text” }

Question

我写了一些虚拟的CSS。但是我得到的是转义字符而不是标签。如何替换为

标签？

.HeaderName:after{
content: "<div class=\"Name2\">text</div>";
}

.Name2 {
color: red;
}

- user34537

Answer 1

content 声明不能向页面添加标签（标签是结构性的）；此外，CSS 用于展示变化而不是结构性内容变化。

相反，考虑使用 jQuery，例如：

$(".HeaderName").after("your html here");

- Matteo Mosca

---

最后，通过CSS content属性添加的文本不会插入到DOM中，因此后续无法通过Javascript等方式对其进行操作。我同意一般情况下不应该使用它，当然也不应该用于此目的。+1 - Jacob Mattison

在某些情境下，使用content属性可以符合样式上的正确性。例如，在某些内容后面添加逗号：<span class="city">纽约</span><span class="state">NY</span>.city:after { content: ", "; }所以，这并不总是错误的，但也绝非推荐做法。 - Ryan Kinal

一个有用的例子是在标签后面加冒号(:)，或在必填字段后面加星号(*)。可以认为这些只是表现细节，屏幕阅读器不应该将“冒号”或“星号”作为内容的一部分读出来。 - andho

有更多有用的例子。特别是考虑到图标字体！ - ProblemsOfSumit

Answer 2

如果您只需要额外的标记来使添加的文本变为红色，只需执行以下操作：

.HeaderName:after{
    content: "text";
    color:red;
}

在Chrome上进行测试。

- Omiod

Answer 3

在CSS中，您无法使用content：插入标记。以下是规范的相关部分；请参阅CSS 2.1规范中的'content'属性。

- Dominic Cooney