Question

在bootstrap的文档中，我阅读了有关图标的内容，并尝试将它们合并到我的文件中，如此

<!doctype html>
<html>
<head>
<meta charset = "utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> Getting started with bootstrap</title>
<link href ="css/bootstrap.css" rel ="stylesheet" type="text/css">
<!-- HTML5 shim for IE backwards compatibility -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
</head>

<body>
<div class ="container-fluid">
    <header class= "row-fluid">
        <h1 class="span12" >This is my first Bootstrap page.</h1>
    </header>
   <i class="icon-calendar"></i>

</div>
<script src = "js/jquery-1.10.2.min.js"></script>
<script src = "js/bootstrap.min.js"</script>
</body>
</html>

但没有任何反应。没有可见的日历图像。

Answer 1

试试这个

<i class="icon icon-calendar"> </i>

Answer 2

好的，这是答案。由于您使用的是Bootstrap 3，因此忘记包含图标包。这是你应该怎么做的：

<span class="glyphicon glyphicon-ok"></span>.

转到此处：http://glyphicons.getbootstrap.com/
点击从Github下载
解压缩文件夹并将CSS文件夹内容复制到您自己的CSS文件夹中。
将字体文件夹复制为同一目录中的css文件夹。
然后，一旦添加了字体和css，请添加如上所示的代码。

Answer 3

bootstrap 3不再在其基础包中包含glyphicons。来自Bootstrap 3 RC2 Reference，

随着Bootstrap 3的推出，图标已被移动到一个单独的存储库中。这使主要项目尽可能精简，使人们更容易交换图标库，并使得Glyphicons图标字体更容易被更多人用于Bootstrap之外。

Bootstrap图标不可见

3 个答案: