0

我现在正在构建一个使用clickatell提供 SMS 服务的新网站。该网站有许多未在客户端定义的字体系列，例如，如果我从其他计算机打开该网站，字体将显示为默认值。我已经学会font-face了CSS；但它不起作用>这是我的简单测试代码：

<html>
    <head></head>
    <style> 
        @font-face {
            font-family: 'oswald_stencilregular';
            src: url('/protected/extensions/Fonts/oswald/Oswald-Light.otf');
            font-weight: normal;
            font-style: normal;
        }
    </style>
    <body>
        <div style='font-family:oswald_stencilregular'>
            give me my font 
        </div>
    </body>
</html>

看，这是简单的代码，但测试"give me my font"不会用这种字体显示；从代码中可以看出，我已经安装了字体并创建了字体路径。我已经测试了来自其他php文件的路径并且它正在工作，我已经进行了很多研究但仍然存在同样的问题，这就是为什么这个字体的声明不起作用，是否有另一种方法可以在服务器端声明字体所以客户端不会关心他是否有这种类型的字体和他的计算机，他会显示服务器端声明的字体吗？

4

4 回答 4

1

首先，确保您的style声明使用双引号（即：style="font-family:oswald_stencilregular;"

其次，请注意每个浏览器使用不同的字体格式。除非您在 Safari 3.2+ 或 Firefox 中进行测试，否则您的浏览器需要不同的字体格式，例如 .woff 或 .ttf 或 .svg。

于 2013-08-18T06:59:07.683 回答
1

font-face这是我在许多项目中使用过的跨浏览器，它工作得很好：

@font-face {
  font-family: "YOURFONT";
  src: url('path-to/font.eot?#') format('eot'),  /* IE6–8 */
       url('path-to/font.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
       url('path-to/font.ttf') format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}

但是，您必须测试其他一些东西： 1.您的服务器是否支持mime-type您的字体？2. 你在测试哪个浏览器？

于 2013-08-18T06:59:47.100 回答
1

没有适用于所有浏览器的单一字体格式。为了避免这种情况，您通常为所需的每种字体添加多种字体格式。它的 CSS 看起来像这样：

@font-face {
    font-family: 'BMR';
    src: local('blissmediumregular');
    src: url('/fonts/blissmedium-webfont.eot');
    src: url('/fonts/blissmedium-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/blissmedium-webfont.woff') format('woff'),
         url('/fonts/blissmedium-webfont.ttf') format('truetype'),
         url('/fonts/blissmedium-webfont.svg#blissmediumregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

您还可以尝试使用Font Squirrel之类的字体生成器工具来获取所需的不同字体类型。

于 2013-08-18T07:02:39.307 回答
0

某些托管服务器不支持字体样式，因为在 Windows 服务器中，您需要向其添加 .otf mime-type 以允许字体正常工作。

您使用的是 Windows 服务器吗？

于 2013-08-18T06:57:03.883 回答