9

正如我在标题中提到的，当使用 css font-family，自定义字体（font-face）时，它会在 Opera 中弄乱（黑色背景，黑色文本（我猜））自动完成下拉列表。

input[type='text'], input[type='password'], input[type='email'], input[placeholder] {
    font-size: 1.2em;
    font-family:  sans-serif;
    color: #2A873A;
    padding-left: 25px;
}

上面的代码工作正常，但如果我替换“font-family:sans-serif;” 使用一些字体字体（谷歌网络字体也是如此），然后问题就开始了。

这是“错误”的截图。

在此处输入图像描述

PS 我应该提到的是 Opera 的本机自动完成，而不是自定义 js，下拉列表。

编辑：http: //jsfiddle.net/burCR/

4

4 回答 4

1

同上直接指定字体。您可能还想尝试使用 base64 编码，根据我的经验，它工作得很好，并且具有很好的跨浏览器兼容性。

于 2013-09-05T23:16:35.163 回答
1

您是否尝试过直接在 CSS 中指定字体？例如：

div.magicsomething {font-family:CustomFont,Customfont2,sans-serif;}

请记住，嵌套元素会被自定义字体卡住，因此，如果您不执行上述操作，您可能还非常需要font-family:inherit“嵌套元素”。

如需额外帮助，请提及自定义字体的名称、完整的 CSS 和指向您网站的实时链接

于 2012-05-06T08:21:53.733 回答
1

您可以分别为背景和文本指定颜色。

input   {
    background-color: white;
    color: black;
    font-family: "My Fontface Font", Verdana, ms serif;
}
于 2014-02-25T22:10:14.323 回答
1

尽管这可能很明显，但请检查以确保您的字体与 Opera 兼容。这是一些网络安全字体的列表。

http://www.w3schools.com/cssref/css_websafe_fonts.asp

如果这不起作用，请尝试从 microsoft word 中获取您想要的字体并使用 @fontface 插入您的自定义字体，而不是使用网络安全字体。

最后尝试在表单上使用您的字体系列并让输入继承字体。希望这有帮助。

于 2013-06-24T03:50:14.577 回答