Html CSS数据内容属性转义反斜杠

因此，我有以下HTML结构：

<ul>
<li data-content="\ec00"></li>
<li data-content="\ec01"></li>
</ul>

它显示ec00和ec01，而不是带有反斜杠的

你知道我该怎么做吗

背后的想法是为大量的图标选择颜色

提前感谢,，

---

Dorian

这是因为您使用的字符编码在HTML中没有正确解析。请记住，CSS以明文形式访问

数据-

属性，而且由于HTML不解析十六进制字符，

\ec00

不会被解析，因为它应该与在CSS文件中使用时进行比较

你能做的是：

• 使用字符本身，即'�' 在

  数据-

  属性中
• 使用将由浏览器解析的数字（十进制）等价物：

  

  （因为十六进制的

  ec00

  是十进制的

  60416

  ，并且

  \ec00

  在CSS中用于强制解析，而

  &#…

  在HTML中用于指示十进制实体）

例如版权符号：

• 十进制：

  169

  。在HTML中，您将使用

  ©

• 十六进制：

  00A9

  。在CSS中，您将使用

  \00A9

  ，而在JS中，您将使用

  \u00A9

下面是一个概念验证演示：

li:before{content:attr（数据内容）；右边距：1em；}

使用
和#169，由HTML引擎解析
使用
\u00A9
的
将不会被HTML引擎解析
使用
\00A9
的
将不会被HTML引擎解析

也可以转义斜杠，即“\\ec00”？尝试过了吗，按原样输出，\\ec00嘿，Terry，非常感谢你的详细评论，现在事情真的有意义了！：）干杯

li:before { content: attr(data-content) }