0

当涉及到服务器端问题时，我是一个完整的新手，所以请耐心等待。

我有一个问题，我的字体文件没有显示在一台服务器上，但它们显示在另一台服务器上。

我不确定哪个服务器托管实际文件，因为我只处理 html/css。

我的字体声明是：

@font-face {
    font-family: 'Pictos';
    src: url("fonts/pictos-web.eot");
    src: local("?"), url("fonts/pictos-web.woff") format("woff"), url("fonts/pictos-web.ttf") format("truetype"), url("fonts/pictos-web.svg#webfontIyfZbseF") format("svg");
    font-weight: normal;
    font-style: normal;
}

.pictos {
    font-family:'Pictos';
    color:#FC6;
}

css文件链接为：

<link rel="stylesheet" media="screen,handheld" type="text/css" href="css/global.css">

我检查了网络选项卡，状态代码是 301（永久移动） 虽然它们仍然正确显示，但也有图像被重定向。与 css 文件中的样式相同。但是，服务器正在以下位置查找文件：

/css/global.css/fonts/pictos-web.woff/

当他们应该是这样的：

 /css/fonts/pictos-web.woff

最莫名其妙的是，该字体在 IE 9-7 中正常工作，但在 FF、Chrome 和 Safari 中不能正常工作。

4

1 回答 1

2

.css 文件中的 url 相对于 css 文件本身，而不是使用该 css 文件的文档。例如

page: http://example.com/dir/subdir/index.php
css:  http://example.com/css/styles.css
         containing: url('foo/bar/img.jpg')

鉴于该布局，浏览器将尝试获取

http://example.com/css/foo/bar/img.jpg
                   ^^^

您的 css url 应该是本地绝对的，例如

 url('/foo/bar/img.jpg');
      ^---

确保在没有浏览器级“重定向”的情况下完成正确的路径。

于 2012-10-11T15:19:25.780 回答