【发布时间】：2018-10-12 18:31:35
【问题描述】：
我正在尝试使用来自HTML5 UP (Arcana) 的模板创建一个网站。模板的结构如下所示：
/资产
/assets/css
/资产/字体
/资产/js
/assets/sass
/index.html
在不修改任何内容时，模板按预期工作，并且 Font Awesome 中的所有图标都正确显示 (like here)。
现在我想像这样构建我的网站：
/资产
/assets/css
/资产/字体
/资产/js
/assets/sass
/foo/page.html
/bar/page.html
/index.html
现在，当我打开 /foo/page.html 时，样式和 Font Awesome 图标都不见了，因为对它们的引用搞砸了。
<link rel="stylesheet" href="assets/css/main.css" /><script src="assets/js/main.js"></script>
我试着这样修复它：
<link rel="stylesheet" href="../assets/css/main.css" /><script src="../assets/js/main.js"></script>
现在该样式再次起作用，但 Font Awesome 图标仍显示为框。
我也尝试过像这样包含 Font Awesome：
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
但是，图标仍然不起作用。
改变
<a href="#" class="icon fa-twitter"></a>
到
<a href="#" class="icon fa fa-twitter"></a>
也不行。
更新：由于某种原因，这在 Firefox 中不起作用，但在 MS Edge 中可以正常使用。
【问题讨论】：
标签： html css templates fonts font-awesome