在 HTML 中显示 unicode 符号答案

【问题标题】：Displaying unicode symbols in HTML在 HTML 中显示 unicode 符号
【发布时间】：2010-12-14 08:59:25
【问题描述】：

我想在 HTML 页面中简单地显示勾号 (✔) 和叉号 (✘)，但它显示为框或 goop âœ - 显然与编码有关。

我已将元标记设置为显示 utf-8，但显然我遗漏了一些东西。

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

编辑/解决方案： 通过使用 FireBug 制作的 cmets，我发现我的页面传递的标题实际上是“Content-Type：text/html”而不是 UTF-8。使用 Notepad++ 查看文件格式显示我的文件被格式化为“UTF-8 without BOM”。将其更改为仅 UTF-8 符号现在可以正确显示...但萤火虫似乎仍然指示相同的内容类型。

【问题讨论】：

标签： html unicode

【解决方案1】：

您应该确保 HTTP 服务器标头正确。

特别是标题：

Content-Type: text/html; charset=utf-8

应该在场。

如果存在 HTTP 标头，浏览器会忽略元标记。

还要确保您的文件在提供之前实际编码为 UTF-8，检查/尝试以下操作：

确保您的编辑器将其保存为 UTF-8。
确保您的 FTP 或任何文件传输程序不会弄乱文件。
尝试使用 HTML 编码的实体，例如 &#uuu;。
确实，十六进制转储文件并查看字符，对于✔，它应该是 E2 9C 94 。

注意：如果您使用系统找不到字形的 unicode 字符（没有带有该字符的字体），您的浏览器应该显示一个问号或类似块的符号。但是如果你像你一样看到多个罗马字符，这表示编码问题。

【讨论】：

其实meta标签并没有被忽略，而是HTTP头优先。感谢 Konrad 的精确度。
请注意，要在 CSS ::before 选择器的 content 属性中使用 unicode 字符，需要使用反斜杠表示法。例如：'\2713' 而不是 'ઙ'。

【解决方案2】：

我知道一个答案已被接受，但想指出一些事情。

设置content-type 和charset 显然是一个好习惯，在服务器上设置会更好，因为它可以确保整个应用程序的一致性。

但是，只有当我的应用程序的语言使用大量仅在 UTF-8 字符集中可用的字符时，我才会使用 UTF-8。如果您想在其中一种情况下显示 unicode 字符或符号，您可以在不更改页面的 charset 的情况下这样做。

HTML 渲染器始终能够显示不属于页面编码字符集的符号，只要您在其numeric character reference (NCR) 中提及该符号即可。听起来很奇怪，但这是真的。

因此，即使您的 html 有一个标头表明其编码为 ansi 或任何 iso 字符集，您也可以使用其 html 字符引用以十进制显示复选标记 - & #10003;或十六进制 - ✓

因此，您有点难以理解为什么您的网页会遇到此问题。你能检查一下NCR值是否正确，这是一个很好的参考http://www.fileformat.info/info/unicode/char/2713/index.htm

【讨论】：

"但是，只有当我的应用程序的语言使用大量仅在 UTF-8 字符集中可用的字符时，我才会使用 UTF-8" 为什么？切换有什么坏处？
@dumbledad ：非常好的问题，我想我让自己的偏见影响了我的答案。我的意思是，如果您的整个应用程序已经不是 utf-8，那么将其更改为单个页面的应用程序视频可能工作量太大。此外，如果您的编程语言和内容不需要 utf-8 字符，您可能会意外复制粘贴一个您的编辑器可以处理的垃圾字符（因为它处于 utf-8 模式），但代码在执行期间会失败。话虽如此，如果可以，请更新您的编码和字符集

【解决方案3】：

确保您将文件实际保存为 UTF-8，或者使用 HTML 实体 (&#nnn;) 作为特殊字符。

【讨论】：

似乎没有用于 ✔ 的 HTML 实体，还是我错过了？您如何“实际”将文件保存为 UTF-8 以及如何检查？
@Peter：通过使用像样的编辑器。大多数文本编辑器在其“另存为”对话框中都有一个选项来指定文件编码，或者他们在菜单的某处隐藏了另一个选项。 Vim 使用fileencoding 设置。
@Peter，您可以通过其代码引用任何字符。试试 ✔打勾。
另存为 utf-8。有趣的概念。如果您正在创建静态 HTML 页面，则效果很好。但是......动态网页呢？这个 unicode/utf-8/wide 字符的东西真的让我很困惑。我的后端代码是 perl。 http标头设置正确，html标头也是如此。 W3C 国际化检查器确认我已将文档设置为 utf-8。套管重要吗？最后，文本输入框呢？我仍然得到咕噜！ :(
上一条评论的补充：我的数据库显示数据输入正确，字符显示正确。所以，不是数据库问题。我的 perl 脚本（或者更确切地说，编辑器）设置为将脚本保存为 utf-8。我的服务器 apache2，我相当确定没有干扰，或者设置正确。所有这一切，仍然不确定为什么字符是粘稠的。啊。必须有更好的方法

【解决方案4】：

与 Nicolas 提出的不同，meta 标签实际上并没有被浏览器忽略。但是，Content-Type HTTP 标头始终优先于文档中存在的meta 标记。

因此，请确保您通过 HTTP 标头发送正确的编码，或者根本不发送此 HTTP 标头（不推荐）。 meta 标签主要是不通过 HTTP 流量发送的本地文档的后备选项。

使用 HTML 实体也应该被认为是一种解决方法——这是对真正问题的蹑手蹑脚。正确配置 Web 服务器可以避免很多麻烦。

【讨论】：

【解决方案5】：

我认为这是一个文件问题，您简单地将文件保存为 1 字节编码，如 latin-1。谷歌你的编辑器以及如何将文件设置为 utf-8。

我想知道为什么有些编辑器不默认为 utf-8。

【讨论】：