0

早些时候我问过IE8+ 中的字体

现在我面临另一个字体问题。您可以在上面的屏幕截图中看到它:

IE问题2

问题是我在输入中使用的字体与按钮使用的字体相同。这两个元素都使用西里尔字符。但是正如您所看到的,西里尔文在输入标签中不起作用,并且在按钮上工作正常。

@font-face 和输入标签是否存在任何 IE9+ 特定问题?我试过用谷歌搜索它,但没有运气。

我用过的字体你可以在这里下载。该存档包括所有网络字体类型(ttf、eot、woff 和 svg)。

UPD:示例

CSS:

@font-face {
    font-family: "LT Round";
    src: url(https://dl.dropboxusercontent.com/u/12269325/fonts/LT-Round.eot);
    src: url(https://dl.dropboxusercontent.com/u/12269325/fonts/LT-Round.eot?#iefix) format("embedded-opentype"),
         url(https://dl.dropboxusercontent.com/u/12269325/fonts/LT-Round.woff) format("woff"),
         url(https://dl.dropboxusercontent.com/u/12269325/fonts/LT-Round.ttf) format("truetype"),
         url(https://dl.dropboxusercontent.com/u/12269325/fonts/LT-Round.svg#a_futuraroundregular) format("svg");
    font-weight: normal;
    font-style: normal;
}

body{
    padding: 30px;
}

p{
    font: 16px/normal 'LT Round';
    width: 300px;
    margin: 0 auto;
    text-align: center;
    padding-bottom: 20px;
}

.bad-font-face{
    font: 18px/30px 'LT Round';
    border: 1px solid #ccc;
    padding: 0 30px;
    height: 30px;
    width: 200px;
    text-align: center;
    display: block;
    margin: 0 auto;
}

HTML:

<p>This is an expample of wrong rendering cyrillic font-face in IE8+</p>

<input type="text" class="bad-font-face" value="тут будет bad font face">

JSFiddle 上的现场演示

提前致谢。

4

1 回答 1

1

很抱歉成为坏消息的承担者。这是浏览器问题 - 不是 CSS 或字体文件问题。

如果您将西里尔文文本放在p该小提琴的标签中,您可以看到字体呈现西里尔文文本就好了(适用于您提供的.eot.woff文件)。

Internet Explorer(至少到 10 版)在使用@font-face.

我还建议不要使用像 cufón 这样的框架来解决这个问题,因为在文本字段上使用时会引入很多可用性问题。

除了在 Internet Explorer 中为这些字段使用默认字体外,我们对此问题无能为力。

于 2013-09-25T18:12:16.750 回答