html - @font-face 嵌入字体未显示在 Android 浏览器选择标签中

Question

我在我的网页中使用 @font-face 嵌入的 ttf 字体。

问题是，每当我使用它在选择标签中显示项目或选项时，除了当前选定的项目之外的所有内容在 Android 浏览器中都显示为乱码。当我在 Chrome 等桌面浏览器中尝试时，它会正确显示。

截图：

在桌面 Chrome 中正确显示：

非活动选择在 Android 浏览器中正确显示：

当我在 Android 浏览器中单击选择时显示乱码：

我正在使用以下 CSS 嵌入字体：

@font-face{
font-family: "MyFont";
src: url('../fonts/MyFont.ttf')  format('truetype');
}

以及将字体应用于选择标签的以下 CSS 规则：

select{
font-family: MyFont !important;
font-size: 16px;
}

select option{
font-family: MyFont !important;
font-size: 16px;
}

我在整个网页中都使用了相同的字体，除了选择标签外，它在任何地方都可以正常工作。我怎么解决这个问题？

score 1 · Accepted Answer

你不能。我猜浏览器正在尝试做正确的事情，但是本机控件不使用默认系统字体以外的其他字体。

也许这在较新版本的 Android 或 Android 上的其他浏览器（例如 Chrome）中已修复。

您需要在使用 HTML 的 JS 中制作自己的选择标签副本来制作控件。

像http://harvesthq.github.com/chosen/这样的东西会做你需要的，虽然很遗憾，因为本机控件通常在很多方面都更好（除了这个问题！）

1 回答 1