CSS样式问题

Question

有没有办法通过CSS样式添加特殊字符♦，如果可以的话，你能展示一个适用于大多数浏览器的例子吗？

Answer 1

不，这是不可能的。

使用:after { content: }时，您无法在内容字符串中指定HTML标记或实体。但是，您可以直接指定符号。 （这是因为内容字符串不是作为XML / HTML解析，而是作为纯文本解析，并逐字插入。）

换句话说：a:after { content: "<" }会产生与<a href="#">Some Link</a>&amp;lt;等效的视觉效果。

a:after { content: "♦" };将完美地工作，但是。

Answer 2

您可以使用：after和：在伪元素之前，但是并非所有浏览器都支持它们，请查看

http://www.w3schools.com/css/pr_pseudo_after.asp http://www.w3schools.com/css/pr_pseudo_before.asp

Answer 3

您应该始终避免使用CSS内容，因为将表示与页面内容混合是错误的。

此外，CSS内容为not supported by some browsers，即IE6和IE7。

如果我想这样做，我会使用CSS附加背景图片并在单词周围添加一些HTML元素：

<style type="text/css">
abbr { padding-right:20px; 
background:url("http://img690.imageshack.us/img690/2005/blackdiamond.png") right no-repeat; }
</style>

<abbr>Something</abbr> very very Important goes here.

结果：

唯一的问题是 - 如果我可以修改HTML以使用<span>或<abbr>或任何其他HTML元素包装我的单词，我可能只需要写一个＆amp; diams;在代码本身......你的电话。