gpt4 book ai didi

internet-explorer - 我们尝试过的 IE 字体问题和解决方案

转载 作者:行者123 更新时间:2023-12-01 05:25:05 24 4
gpt4 key购买 nike

我知道这是一个常见问题,我尝试了几乎所有我能找到的解决方案,我想知道展示一点代码是否会更有用。

问题

我正在尝试为客户端实现 4 种字体。当前文件是用 font-squirrel 生成的。但是,这些字体根本不适用于 IE 7/8,部分适用于 IE9。

字体本身的跨浏览器渲染不是这里的问题,我只是想让它显示出来。

我们尝试过的

我们(在我工作的公司)花了很多时间做以下事情:
- 我们发现了多种语法, font-squirrel 一种更完整。
- 在页面加载后几秒内在 JavaScript 中重新加载 CSS(适用于旧项目)。
- 检查所有语法问题。
- 检查是否有 404 错误
- 使用相同的名称,但具有不同的字体粗细
- 尝试添加 ?#iefix 和使用的特定格式

截屏

enter image description here

示例代码

你可以在:http://dev.phin.fr/fontsie/现场看到它

句法

@font-face {
font-family: 'DidotBoldItalic';
src: url('fonts/DidotHTF-24BoldItalic.eot');
src: url('fonts/DidotHTF-24BoldItalic.ttf') format('truetype'), url('fonts/DidotHTF-24BoldItalic.svg') format('svg');
font-weight: normal;
font-style: normal;
}

谢谢!

最佳答案

我冒昧地从您的示例中下载了所有文件和代码。

我注意到您缺少« 本地('☺') » 属性在您的 CSS 声明中,请查看以下示例的第三行:

@font-face {
font-family: 'SofiaProBold';
src: url('Sofia-Pro-Bold.eot');
src: local('☺'), url('Sofia-Pro-Bold.ttf') format('truetype'), url('Sofia-Pro-Bold.svg') format('svg');
font-weight: normal;
font-style: normal;
}

您可以在 IE8 (PC) 中查看结果 http://imageftw.com/uploads/20130116/font-fix.png

这个小技巧解决了 Sofia 字体的问题,但不幸的是,它不适用于 Didot 字体。我可以假设该字体最初不是网络字体或拥有版权并且 fontsquirrel 无法对其进行转换。

以下仅是我的 个人意见 .

使用字体时,尝试将所有 @font-face 声明放在包含所有字体文件的同一目录中的 CSS 文件中,然后将此类 CSS 文件链接到 <head>你的文件。

例子:
/fonts/myfont/myfont.css « add to the document's <head>
/fonts/myfont/myfont.woff
/fonts/myfont/myfont.eot
/fonts/myfont/myfont.ttf
/fonts/myfont/myfont.svg

这不仅可以更容易地找到应用的@font-face,而且还可以避免在 url('myfont/font.ttf') 中使用相对/绝对路径。属性。

关于internet-explorer - 我们尝试过的 IE 字体问题和解决方案,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14365520/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com