我刚刚带来了Web字体第一次使用。我已经将其上传到我们的测试服务器，它可以在办公室的所有计算机上运行，除了一台笔记本电脑。
在发现笔记本电脑无法正常工作之后，我在crossbrowsertesting.com上对所有平台进行了测试，发现它没有出现在任何平台上。
然后，我将mywebsfontkit文件夹上载了有关如何将webfont安装到我的服务器的说明，并进行了另一个跨浏览器检查，发现该字体开始在某些浏览器上起作用，但是当我尝试将其放入自己的页面时，它失败了。
我尝试了几种方法使其工作。
1-我将完整的URL路径放入字体中-没有任何反应
2-我已将webfonts放在服务器的根文件夹和根文件夹中
3-我尝试以不同的方式调用字体museo，即font-family：'Museo'或font-family：'Museo-700'。
在我发布的示例中，您会看到，对于导航而言，我将museo称为museo-700，现在在我的机器上称为arial，而在标头中的文本上，我将museo称为font-family：“ Museo”。我知道它不能在所有浏览器上使用，但是我不知道为什么它可以在一个文件中而不在另一个文件中工作。
我还添加了我的.htaccess文件
AddType字体/ ttf .ttf
AddType字体/ eot .eot
AddType字体/ otf .otf
AddType字体/ woff .woff
包含字体的样式表被称为如下
<link rel="stylesheet" type="text/css" href="css/type.css" />
具有字体的样式表
@font-face {font-family: 'Museo-900';src: url('webfonts/23C024_0_0.eot');src: url('webfonts/23C024_0_0.eot?#iefix') format('embedded-opentype'),url('webfonts/23C024_0_0.woff') format('woff'),url('webfonts/23C024_0_0.ttf') format('truetype');}
@font-face {font-family: 'Museo-700';src: url('webfonts/23C024_1_0.eot');src: url('webfonts/23C024_1_0.eot?#iefix') format('embedded-opentype'),url('webfonts/23C024_1_0.woff') format('woff'),url('webfonts/23C024_1_0.ttf') format('truetype');}
@font-face {font-family: 'Museo-500';src: url('webfonts/23C024_2_0.eot');src: url('webfonts/23C024_2_0.eot?#iefix') format('embedded-opentype'),url('webfonts/23C024_2_0.woff') format('woff'),url('webfonts/23C024_2_0.ttf') format('truetype');}
以及我如何调用导航和标题的字体
#nav ul li {
float: left;
position: relative;
color:#000;
font-family: 'Museo-700', Arial, sans-serif;
font-size: 12px;
font-weight: normal;
}
.title-900 {
font-family: 'Museo-900', Arial, sans-serif !important;
font-weight: normal;
font-size:18px;
line-height:20px;
color:#9BC255;
padding-bottom:10px;
}
最佳答案
在@font-face部分中，您已调用已加载的字体Museo-900，Museo-700，Museo-500，并且必须在常规指令中使用相同的字体系列，例如：
font-family: "Museo-900", Arial, sans-serif !important;
除此之外，我在您的沙箱中看不到其他任何可能导致此类问题的信息。
关于css - @fontface安装不正确，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/11996958/