Css相对网址图像没有出现

Question

我的图标出现问题＆＃34;没有出现＆＃34;在网页上，这些图标分别存储在fonts文件夹中。

下面是我的styles.css的片段

styles.css的

@font-face {
  font-family: 'FontAwesome';
  src: url('../../fonts/fontawesome-webfont.eot?v=4.1.0');
  src: url('../../fonts/fontawesome-webfont.eot?#iefix&v=4.1.0') format('embedded-opentype'), url('../../fonts/fontawesome-webfont.woff?v=4.1.0') format('woff'), url('../../fonts/fontawesome-webfont.ttf?v=4.1.0') format('truetype'), url('../../fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

我的文件结构

如何引用我的文件以确保我的图标正确显示？ 根据此处的示例，http://css-tricks.com/quick-reminder-about-file-paths/ 我用＆＃34; ../../"因为这将转到资源/字体。 我错了吗？

请帮忙吗？ 谢谢！

Answer 1

每个../用于上一个目录。您目前位于css /目录中。 如果你想获得资源/字体，你只需要一个 ../来获取资源，然后你可以输入fonts /

Answer 2

你的CSS应该是：

@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?v=4.1.0');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.1.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.1.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.1.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}