twitter-bootstrap 一些引导程序字形未加载
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/28267666/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Some bootstrap glyphicons not loading
提问by Jonny
I have a WordPress theme that I'm building with Bootstrap Sass source. The styles are working, but most of the glyphicons aren't (only asterisk and plus). I'm compiling my Bootstrap to the style.cssand relative to that, there is a folder called fontswhich holds the glyphicons (I set the $icon-font-path: "fonts/";) Here is a snippet from my compiled style.cssto show that the fonts path is correct:
我有一个使用 Bootstrap Sass 源构建的 WordPress 主题。样式有效，但大多数字形无效（只有星号和加号）。我正在将我的 Bootstrap 编译到style.css并且相对于它，有一个名为的文件夹fonts，其中包含字形（我设置了$icon-font-path: "fonts/";）这是我编译的一个片段，style.css以显示字体路径是正确的：
@font-face { font-family: 'Glyphicons Halflings'; src: url("fonts/glyphicons-halflings-regular.eot"); src: url("fonts/glyphicons-halflings-regular.eot?#iefix") format("embedded-opentype"), url("fonts/glyphicons-halflings-regular.woff2") format("woff2"), url("fonts/glyphicons-halflings-regular.woff") format("woff"), url("fonts/glyphicons-halflings-regular.ttf") format("truetype"), url("fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular") format("svg"); }
.glyphicon { position: relative; top: 1px; display: inline-block; font-family: 'Glyphicons Halflings'; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
For e.g, these work:
例如，这些工作：
<span class="glyphicon glyphicon-asterisk" aria-hidden="true"></span>
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
But these don't:
但这些没有：
<span class="glyphicon glyphicon-thumbs-up" aria-hidden="true"></span>
<span class="glyphicon glyphicon-heart" aria-hidden="true"></span>
Here's a snippet of the glyphicon classes:
这是 glyphicon 类的一个片段：
.glyphicon-asterisk:before { content: "a"; }
.glyphicon-plus:before { content: "b"; }
.glyphicon-star:before { content: \e006; }
.glyphicon-thumbs-up:before { content: \e125; }
I checked the network tab to see if it was loading the glyphicon fonts, and they only appear when the glyphicons work (asterisk, plus). Otherwise, the font file isn't even shown in the network tab (not even a 404).
我检查了网络选项卡以查看它是否正在加载字形字体，并且它们仅在字形工作时出现（星号，加号）。否则，字体文件甚至不会显示在网络选项卡中（甚至没有404）。
采纳答案by Jonny
The issue was that the content values were not wrapped in quotes. This is still an issue with the www.getbootstrap.comsass source download, but was recently fixedin the bootstrap-sassgithub repo.
问题是内容值没有用引号括起来。这仍然是www.getbootstrap.comsass 源下载的问题，但最近在bootstrap-sassgithub repo 中得到了修复。
