3

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

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

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

  1. 制作符号图像
  2. 找到一个合适的、更兼容的符号来代替。

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

因此，我正在寻找建议，哪些符号不需要特定的字体，因为我无法在网上找到该信息。（我不知道这些以前需要它们）

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

4

3 回答 3

1

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

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

使用嵌入字体来获取两个字符会有些不成比例。使用图标字体技巧将意味着可访问性问题（您不能真正听到空元素，可以吗）。

使用诸如“v”和“x”之类的字符作为替换会给人一种不专业的印象，并可能导致理解上的问题。

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

于 2013-10-29T14:29:32.000 回答
0

我会 ：

  • 找到包含这些符号的字体
  • 使用 @font-face 是我的 css 来加载相关字体
  • 使用我找到的字体在我的 css 中定义一个 span.myfont

例如使用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>

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

于 2013-10-29T13:52:44.547 回答
0

您可以为此使用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>or<i class="fa fa-times"></i>显示两个图标check和times（也许还有一个更好的 for times，查看完整列表）

于 2013-10-29T14:02:33.107 回答