css - 使用 CSS 伪元素插入×

Question

我正在尝试使用 × × HTML 字符作为对话框链接上的关闭图标

.close:before {
    content: "\0274c";
    display: block;
    text-align: center;
    vertical-align: middle;
}

Firefox 与上面的例子一起工作，也使用

content: "\274c";

Chrome 不会接受任何一个，只是给我一个缺失的字符方 block 。我使用 Arial 作为字体。我需要做什么才能使这个跨浏览器兼容？

Answer 1

您使用的转义序列不代表 × 符号。它代表 U+274C CROSS MARK，这是一个完全不同的符号(恰好也用表情符号表示)。

如注释中所述，× 的代码点是 U+00D7 MULTIPLICATION SIGN，这就是您要查找的内容。大小的差异归结为每个字符字形在字体中的绘制方式。

如果浏览器不呈现 U+274C(或与此相关的任何其他给定字符)，则可能是字体、浏览器甚至平台存在问题。