如何让字形在 twitter-bootstrap 中工作?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/29747963/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 22:34:12  来源:igfitidea点击:

How to get glyphicons working in twitter-bootstrap?

csstwitter-bootstrapglyphicons

提问by Jonathan M

I've got bootstrap files stored locally:

我有本地存储的引导程序文件:

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

and

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

but when I do this:

但是当我这样做时:

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

I get a little square character such as is displayed when the client doesn't have the proper font. I read herethat there's separate CSS, but the link is broken. Any ideas how to resolve this?

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

回答by Kevin Leegsma

There is Jonathan, inside the bootstrap download you should have the following file structure (unless you selected NOT to download glyphicons as a component)

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

有乔纳森,在引导程序下载中,您应该具有以下文件结构(除非您选择不将字形作为组件下载)

css ->bootstrap.css、bootstrap.css.map、bootstrap.min.css、bootstrap-theme。 css、bootstrap-theme.css.map、bootstrap-theme.min.css
字体 ->glyphicons-halflings-regular.eot、glyphicons-halflings-regular.svg、glyphicons-halflings-regular.ttf、glyphicons-halflings-regular。 woff, glyphicons-halflings-regular.woff2
js ->bootstrap.js, bootstrap.min.js, npm.js

If you dont have that, i'd recommend going to http://getbootstrap.com/getting-started/#downloadand downloading the package. Linking it up inside your own folder is easy. Just rename the Bootstrap CSS folder to 'Bootstrap' then drag it to your CSS folder in your file (you can take the files directly, but having the folder as CSS/Bootstrap/bootstrapCSSfilesit just makes it more organized. Do that again for JS and Fonts and you're all set.

如果您没有,我建议您访问http://getbootstrap.com/getting-started/#download并下载该软件包。将它链接到您自己的文件夹中很容易。只需将 Bootstrap CSS 文件夹重命名为“Bootstrap”,然后将其拖到文件中的 CSS 文件夹中(您可以直接获取文件,但将文件夹设为CSS/Bootstrap/bootstrapCSSfiles只会使其更有条理。对 JS 再次执行此操作和字体,你都准备好了。

Goodluck bud :D

祝你好运 :D

回答by naoxink

It works with no problems.

它没有问题。

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

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

http://jsfiddle.net/3v1tyL61/

http://jsfiddle.net/3v1tyL61/