页面上如何显示特殊字符、Unicode字符？

在前端开发中，显示特殊字符通常涉及到HTML实体（HTML Entities）或 Unicode 字符的使用。以下是一些常见的方法来处理特殊字符的显示：

1、HTML实体：

HTML为一些常见的特殊字符提供了预定义的实体。例如，要显示一个小于号（<），你可以使用HTML实体 &lt;。同样，要显示一个大于号（>），你可以使用 &gt;。其他常见的HTML实体包括 &amp;（表示和号&）、&quot;（表示双引号"）和 &apos;（表示单引号’）。

<p>这是一个小于号：&lt;</p>
<p>这是一个大于号：&gt;</p>

2、Unicode字符：

对于不在HTML实体列表中的特殊字符，你可以使用Unicode字符。Unicode是一种字符编码规范，它为每个字符分配了一个唯一的编号。使用 &# 后跟字符的 Unicode代码，然后以分号（;）结束来表示Unicode字符。

在线编码转换工具程序员开发编码转换

<p>这是Unicode ☂（十进制表示） ：&#9730;</p>
<p>这是Unicode ☂（十六进制表示） ：&#x2602;</p>
<p>这是Unicode ウ ：&#x30A6;</p>
<p>这是Unicode 万 ：&#x4E07;</p>
<p>这是Unicode ≠ ：&#x2260;</p>

 

3、JavaScript转义：

使用JavaScript来动态插入文本到HTML中。使用 \uXXXX（其中XXXX是字符的Unicode码点）来表示Unicode字符。

<p>这是Unicode ☂：{{ '\u2602' }}</p>
<p>这是Unicode ウ ：{{ '\u30A6' }}</p>
<p>这是Unicode 万 ：{{ '\u4E07' }}</p>
<p>这是Unicode ≠ ：{{ '\u2260' }}</p>

 

4、CSS内容属性：

使用CSS的 content 属性来显示特殊字符。这通常与伪元素（如 ::before 或 ::after）一起使用。

<p class="p1">这是Unicode ☂：</p>
<p class="p2">这是Unicode ウ ：</p>
<p class="p3">这是Unicode 万 ：</p>
<p class="p4">这是Unicode ≠ ：</p>