css - IcoMoon App图标字体显示为

一切都很好，但是当我使用../时不起作用。要调用CSS，我使用：<link rel="stylesheet" href="../../IcoMoon-App/style.css" />，它的确显示为。我在MainFolder/Albumes/Clarity_Deluxe_Edition/index.html处收到错误，但是使用MainFolder/index.html处的图标时，它们显示得很好（请注意，此图标的css位置是<link rel="stylesheet" href="IcoMoon-App/style.css" />）。这是我的目录的结构：

MainFolder
├index.html
├css
│└index_style.css
├IcoMoon-App
│├IcoMoon-App.eot
│├IcoMoon-App.svg
│├IcoMoon-App.ttf
│├IcoMoon-App.woff
│└style.css
└Albumes
 └Clarity_Deluxe_Edition
  ├index.html
  └css
   └index_style.css

是的，因为我更改了位置，所以我也更改了@ font-face：

@font-face {
    font-family: 'IcoMoon-App';
    src:url('IcoMoon-App.eot?xzz47n');
    src:url('IcoMoon-App.eot?#iefixxzz47n') format('embedded-opentype'),
        url('IcoMoon-App.woff?xzz47n') format('woff'),
        url('IcoMoon-App.ttf?xzz47n') format('truetype'),
        url('IcoMoon-App.svg?xzz47n#IcoMoon-App') format('svg');
    font-weight: normal;
    font-style: normal;
}

我在“后文件夹”中使用了错误的名称（../，不知道确切的名称）吗？还是在更改位置时犯了一个错误？

最佳答案

一种解决方案是使用另一种定义路径的方式。

在CSS文件中，将IcoMoon字体文件的路径更改为：

src:url('/IcoMoon-App/IcoMoon-App.eot?xzz47n');

URL开头的/使浏览器从您的网站的域级别启动，然后完全按照我在示例中显示的那样添加URL。这将为您的IcoMoon字体文件建立一个“绝对” URL，无论您的文件夹结构有多深。

这种方法的缺点是，当您在本地浏览站点时（例如，在http://localhost/~alej27/yoursite），字体可能不会出现，因为这会使浏览器在http://localhost/IcoMoon-App/IcoMoon-App.eot?xzz47n上搜索字体文件。可以通过多种方法来解决（主机文件修改和设置虚拟域），但这不在此问题的范围之内：）

关于css - IcoMoon App图标字体显示为，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/25498591/