Question

我正在尝试制作一个包含符号✔和✘的页面。

分别是Unicode ✔和✘。它适用于我的所有浏览器。但是，我的一些测试人员报告说有盒子而不是这些符号，我发现这是因为他们没有安装字体。 Reference

我使其兼容的选项似乎仅限于：

改为制作符号图片
找到一个合适的，更兼容的符号来代替使用。

我不想使用图像，所以我正在寻找一个不需要特定字体的类似符号。

我正在寻找建议，这些符号不需要特定字体，因为我无法在线找到该信息。（我以前没有意识到这些需要它们）

也欢迎任何替代解决方案。

Answer 1

字体中没有更广泛支持的合适字符。也就是说，有些相似的其他字符具有更有限的字体支持。

如果您想使用这些特定符号，最实用的方法是使用足够大的图像（大约50×50像素）并使用CSS按比例缩小以匹配字体大小（使用例如height: 0.7em CSS），具有alt和OK等充分的wrong属性。

使用嵌入字体只获得两个字符会有点不成比例。使用图标字体欺骗意味着可访问性问题（你真的听不到空元素，你可以）。

使用“v”和“x”等字符作为替代品会产生不专业的印象，并可能导致理解上的问题。

请注意，符号“✔”和“✘”不是通用的。在某些文化中，“✔”传统上用于表示错误（不正确），而“✘”可能被视为中性复选标记（表示已检查某些内容，但并未暗示正面或否定结果）。所以也许你不需要采取额外的措施来使用它们。当然，可以使用某些单词（可以本地化，如果应用程序或页面作为一个整体是可本地化的）。至少在正确性方面，“OK”被广泛理解，很难被误解。

Answer 2

我会：

找到包含这些符号的字体
使用@ font-face是我的css加载相关字体
使用找到的字体

例如，在http://www.fontsquirrel.com/fonts/entypo?q[term]=entypo&q[search_check]=Y

上找到了entypo webfontkit

css：

@font-face {
    font-family: 'entyporegular';
    src: url('Entypo-webfont.eot');
    src: url('Entypo-webfont.eot?#iefix') format('embedded-opentype'),
     url('Entypo-webfont.woff') format('woff'),
     url('Entypo-webfont.ttf') format('truetype'),
     url('Entypo-webfont.svg#entyporegular') format('svg');
font-weight: normal;
font-style: normal;

}
span.symbols { font-family: 'entyporegular'; /*rest of your css here*/}

HTML：

<span class="symbols">&#87;</span>
<span class="symbols">&#88;</span>

以这种方式使用webfont，您可以确保独立于系统字体，并确保加载正确的字符

Answer 3

您可以使用Font Awesome。将以下内容包含在HTML头中：

<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.1/css/font-awesome.css" rel="stylesheet">

然后使用<i class="fa fa-check"></i>或<i class="fa fa-times"></i>来显示两个图标check和times（可能还有times更好的图标，请查看complete list）

缺少字体时✔和✘兼容的替代品

3 个答案: