CSS中“content”属性中的HTML特殊字符

Question

我正在尝试在CSS的:before + content:字段中在一个项目之前添加内容。 我想插入一个勾号 (☑)，但如果我在content选项中使用它，它会打印为字面值。 如何告诉CSS将其作为勾号而不是字面字符串 ☑ 呈现？

- sethvargo

---

问题表述不够清晰。它可能是指诸如 ☑ 这样的符号字面上显示出来（解释是它们在 CSS 中没有特殊含义），即试图在 CSS 中使用 HTML 中的“转义”字符。 - Jukka K. Korpela

Answer 1

试试这个：

#target:before {
  content: "\2611";
}

- Flack

---

是的，但不完全一样。那个可以用（你怎么知道的？？），但我需要带方框（☑）的复选框，而不仅仅是勾号。我在哪里可以查找这些替代代码？ - sethvargo

太棒了，谢谢！我可以问一下你在哪里找到这些信息吗？能否请您引用一下来源，以便我日后参考？ - sethvargo

http://en.wikipedia.org/wiki/List_of_unicode_characters 以及成千上万的其他页面。 - Flack

反斜杠之王！ - Jamie Hutber

Answer 2

您需要在content属性中使用Unicode值。(杂项符号列表也可能有用)

重复的复选标记被列为U+2713，因此您需要输入content: "\2713";

- Brad Mace

---

+1 我曾因为没有意识到 U+ 转换为 \ 而对一个替代符号感到困惑，谢谢。 - Sean Anderson

Answer 3

在 CSS 规则中直接使用复选框字符，而不是编码。

#target:before {
    content: "☑";
}

请查看：http://jsfiddle.net/e3Wt2/

- Yi Jiang

---

这需要确保CSS文件的字符编码或包含CSS代码的HTML文件已经被正确声明，详情请参见http://www.w3.org/International/O-charset。 - Jukka K. Korpela

@Al-Mothafar 你检查了编码吗？ - Yi Jiang

同样重要的是，它需要浏览器尊重编码；并非所有浏览器都能做到。（当然，我指的是旧版IE。） - Chris Krycho