如何让glyphicons在twitter-bootstrap中工作?

时间:2015-04-20 12:31:25

标签: css twitter-bootstrap glyphicons

我已经在本地存储了引导程序文件:

<link rel="stylesheet" href="/bootstrap/3.2.0/css/bootstrap.min.css">

<script src="/bootstrap/3.2.0/js/bootstrap.min.js"></script>

但是当我这样做时:

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

我得到一个小方形字符,例如当客户端没有正确的字体时显示。我看了here那里有单独的CSS,但链接已损坏。有任何想法如何解决这个问题?

3 个答案:

答案 0 :(得分:3)

找到它:

需要本地创建:

/bootstrap/3.2.0/fonts/glyphicons-halflings-regular.eot
/bootstrap/3.2.0/fonts/glyphicons-halflings-regular.woff
/bootstrap/3.2.0/fonts/glyphicons-halflings-regular.ttf
/bootstrap/3.2.0/fonts/glyphicons-halflings-regular.svg

我从这里采购:

http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/fonts/glyphicons-halflings-regular.eot http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/fonts/glyphicons-halflings-regular.woff http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/fonts/glyphicons-halflings-regular.ttf http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/fonts/glyphicons-halflings-regular.svg

答案 1 :(得分:0)

有Jonathan,在bootstrap下载中你应该有以下文件结构(除非你选择不下载glyphicons作为组件)

css - &gt; bootstrap.css,bootstrap.css.map,bootstrap.min.css,bootstrap-theme.css,bootstrap-theme.css.map,bootstrap-theme.min.css
fonts - &gt; glyphicons-halflings-regular.eot,glyphicons-halflings-regular.svg,glyphicons-halflings-regular.ttf,glyphicons-halflings-regular.woff,glyphicons-halflings-regular.woff2
js - &gt; bootstrap.js,bootstrap.min.js,npm.js

如果您没有,我建议您前往http://getbootstrap.com/getting-started/#download并下载该软件包。将其链接到您自己的文件夹中很容易。只需将Bootstrap CSS文件夹重命名为'Bootstrap',然后将其拖到文件中的CSS文件夹中(您可以直接获取文件,但将文件夹设为 CSS / Bootstrap / bootstrapCSSfiles 它只会使它更多有组织的。再次为JS和Fonts做这件事,你们都已经确定了。

Goodluck芽:D

答案 2 :(得分:-1)

没有任何问题。

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

http://jsfiddle.net/3v1tyL61/