一些引导字形未加载

一些引导字形未加载

问题描述:

我有一个Bootstrap Sass源构建的WordPress主题。样式有效,但大多数字形都不起作用(仅星号和加号)。我正在将Bootstrap编译为 style.css ,相对于此,有一个名为 fonts 的文件夹字形(我设置了 $ icon-font-path: fonts /; )这是我编译的 style.css中的代码片段表示字体路径正确:

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.css and relative to that, there is a folder called fonts which holds the glyphicons (I set the $icon-font-path: "fonts/";) Here is a snippet from my compiled style.css to show that the fonts path is correct:

@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; }

例如,这些工作:

<span class="glyphicon glyphicon-asterisk" aria-hidden="true"></span>
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span>

但是这些不是:

<span class="glyphicon glyphicon-thumbs-up" aria-hidden="true"></span>
<span class="glyphicon glyphicon-heart" aria-hidden="true"></span>

以下是glyphicon类的代码段:

Here's a snippet of the glyphicon classes:

.glyphicon-asterisk:before { content: "\2a"; }
.glyphicon-plus:before { content: "\2b"; }  
.glyphicon-star:before { content: \e006; }
.glyphicon-thumbs-up:before { content: \e125; }

我检查了网络标签,看它是否正在加载glyphicon字体,并且它们仅在出现时字形图标起作用(星号加号)。否则,字体文件甚至不会显示在网络标签中(甚至不会显示 404 )。

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).

问题是内容值未用引号引起来。这仍然是 www.getbootstrap.com sass源下载的问题,但最近已修复 bootstrap-sass github回购中。

The issue was that the content values were not wrapped in quotes. This is still an issue with the www.getbootstrap.com sass source download, but was recently fixed in the bootstrap-sass github repo.