我正在尝试建立响应式网站。为此,我使用Bootstrap 3.我已经下载了Bootstrap 3并导入到我的网站根目录:
我不知道为什么,但在小屏幕上它没有显示我的图标:
我的代码:
<!DOCTYPE html>
<html lang="lt">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../bootstrap-3.2.0-dist/css/bootstrap-theme.css">
<link rel="stylesheet" href="../bootstrap-3.2.0-dist/css/bootstrap.min.css">
<link rel="stylesheet" href="../css/reset.css">
<link rel="stylesheet" href="../css/styles.css">
<script src="../js/jquery-2.1.1.js"></script>
<script src="../bootstrap-3.2.0-dist/js/bootstrap.min.js"></script>
<script src="../js/script.js"></script>
<title>
title
</title>
</head>
<body>
<header class="top" role="header">
<div class="container">
<a href="../aplikacija/app.html" class="navbar-brand pull-left">
Application
</a>
<button class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="glyphicon-align-justify"></span>
</button>
<nav class="navbar-collapse collapse" role="navigation">
<ul class="navbar-nav nav">
<li><a href="../aplikacija/app.html">APP</a></li>
<li><a href="../ux/ux.html">UX</a></li>
</ul>
</nav>
</div>
</header>
<div id="app" class="content">
</div>
</body>
</html>
答案 0 :(得分:4)
您的glyphicon span应该包含以下类:glyphicon glyphicon-align-justify
而不仅仅是glyphicon-align-justify
答案 1 :(得分:0)
我建议不要在span中使用align justify作为类 - 只需显示glyphicon,然后在外部div中对其进行对齐。
<div class="text-justify">
<span class="glyphicon glyphicon-align-justify"></span>
</div>
这里有更多信息 - http://getbootstrap.com/components/#glyphicons-how-to-use