css { content: "text"}，如何添加标签？答案

【问题标题】：css { content: "text"}, how do I add tags?css { content: "text"}，如何添加标签？
【发布时间】：2021-01-22 18:11:13
【问题描述】：

我写了一些虚拟的 CSS。而不是标签，我得到了转义字符。我怎样才能添加一个 div 标签呢？

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

.Name2 {
color: red;
}

【问题讨论】：

标签： css

【解决方案1】：

content 声明不能给页面添加标签（标签是结构化的）；此外，CSS 用于表示更改，而不是结构内容更改。

考虑改用jQuery，比如：

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

【讨论】：

最后，通过 CSS content 属性添加的文本不会插入到 DOM 中，因此以后不能被 Javascript 等操作。我同意它不应该在一般情况下使用，并且当然不应该用于此目的。 +1
在某些情况下，使用 content 属性在风格上可能是正确的。例如，在某些内容之后添加逗号：New YorkNY .city:after { content: ", "; } 所以，这不是总是错的，但绝不是推荐的。
一个有用的例子是将冒号 (:) 放在标签之后或星号 (*) 放在必填字段之后。可以同意，这些只是演示细节，屏幕阅读不应将“冒号”或“星号”作为内容的一部分。
还有更多有用的例子。特别是考虑到图标字体！

【解决方案2】：

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

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

在 Chrome 上测试。

【讨论】：

【解决方案3】：

您不能在 CSS 中使用 content: 插入标签。这是规范的相关部分；请参阅 CSS 2.1 规范中的 the 'content' property。

【讨论】：