如何在 ::before 伪元素中使用字符代码 [英] How to use character code with ::before pseudo element

问题描述

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

I have html with <meta charset="UTF-8"> and want add black right-pointing pointer to span::before but it`s not working.

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

If I simply put &#x25ba to html I would see pointer. But with content I see different problems. I try content: '►'; - it`s show strange symbol.

也不起作用 '&#x25ba', '\&#x25ba', '\x25ba', '\#x25ba'、'\9658'等组合.我可以使用 background-image 或类似的东西，但我不想这样做.

Also does not work '&#x25ba', '\&#x25ba', '\x25ba', '\#x25ba', '\9658' and other combinations. I can use background-image or something like that, but I don`t want do this.

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

Maybe you know what I`m doing wrong? Thanks for help!

推荐答案

► 是指向右箭头的 unicode

► is the unicode for a right pointing arrow

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

25B6 or 25BA is the hex for a right pointing arrow

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

In CSS you need to escape the hex when using it, see working example

例如

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>

这篇关于如何在 ::before 伪元素中使用字符代码的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！