css {content:"text"},如何添加标签？

Question

我写了一些虚拟的CSS.而不是标签我得到了转义字符.如何添加div标签呢？

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

.Name2 {
color: red;
}

Answer 1

该content声明不能添加标签页面(标签是结构性的); 另外,CSS用于表示更改,而不是结构内容更改.

考虑使用jQuery,例如:

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

在某些情况下,内容属性的使用可能在风格上是正确的.例如,在某些内容之后添加逗号:<span class ="city">纽约</ span> <span class ="state"> NY </ span> .city:after {content:","; 所以,它不是_always_错误,但它绝不是推荐的. (5认同)
一个有用的例子是在标签后放置冒号(:)或在必填字段后放置星号(*).可以同意这些仅仅是演示细节,屏幕阅读不应该将"冒号"或"星号"视为内容的一部分. (5认同)
最后，通过 CSS content 属性添加的文本不会插入到 DOM 中，因此稍后无法通过 Javascript 等对其进行操作。我同意一般情况下不应使用它，当然也不应将其用于此目的。+1 (3认同)
还有更多有用的例子。特别是考虑图标字体！ (2认同)

Answer 2

您无法content:在CSS中插入标签.这是规范的相关部分; 请参阅CSS 2.1规范中的'content'属性.

Answer 3

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

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

在Chrome上测试过.