当前位置:  开发笔记 > 前端 > 正文

css文件中字体的相对文件路径

如何解决《css文件中字体的相对文件路径》经验,为你挑选了1个好方法。

我有一个标题中引用的样式表:

除了这个特定的代码,所有的css都可以使用它:

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

当我把上面的@ font-face CSS放在上面显示图标的页面上时它可以正常工作但是当我把它放在CSS文件中它停止工作时.我终于发现这可能是由于文件路径不正确.

这是文件结构:

在此输入图像描述

看看这篇文章(https://css-tricks.com/quick-reminder-about-file-paths/)看起来我应该使用:

url('/fonts/icomoon.ttf?hsw0h3')
url('../fonts/icomoon.ttf?hsw0h3')

返回根目录然后进入fonts文件夹.但该图标仍未从css文件中呈现.

我做错了什么,我该如何解决?



1> Quentin..:

CSS文件中的URL与CSS文件相关.

url('fonts/icomoon.eot?hsw0h3');表示http://example.com/css/fonts/icomoon.eot?hsw0h3,但您的目录结构的屏幕截图显示您需要http://example.com/fonts/icomoon.eot?hsw0h3.

添加..//

推荐阅读
手机用户2402852307
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有