如何在 ::before 伪元素中使用字符代码答案

【问题标题】：How to use character code with ::before pseudo element如何在 ::before 伪元素中使用字符代码
【发布时间】：2016-09-10 20:19:12
【问题描述】：

我有带有 <meta charset="UTF-8"> 的 html，并希望将 黑色右指向指针 添加到 span::before 但它不起作用。

如果我只是将 ► 放到 html 中，我会看到指针。但是对于content，我看到了不同的问题。我试试content: '►'; - 它显示奇怪的符号。

'&#x25ba'、'\&#x25ba'、'\x25ba'、'\#x25ba'、'\9658'等组合也不起作用。我可以使用背景图片或类似的东西，但我不想这样做。

也许你知道我做错了什么？感谢您的帮助！

【问题讨论】：

分享一些您用于实现此目的的 HTML。一个可验证的例子会很有帮助。这里有一些用于向您的问题添加示例的信息：How to create a Minimal, Complete, and Verifiable example.

标签： html css utf-8

【解决方案1】：

&#9658; 是右向箭头的 unicode

25B6 或 25BA 是右向箭头的十六进制

在 CSS 中，您需要在使用时转义十六进制，请参阅工作示例

例如

span::before {
  content: '\25B6';
}

#span-2::before {
  content: '\25BA';
}

<meta charset="UTF-8">

<span> Right Pointing Arrow</span>
<br><br>
<span id="span-2"> Another right pointing arrow</span>

<p>&#9658; Unicode Right pointing arrow in HTML</p>

【讨论】：