twitter-bootstrap bootstrap 左右字形未显示在轮播中？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/27555126/
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
bootstrap left and right glyphicons not showing in carousel?
提问by user2668069
The two left and right chevron glyphicon are not showing, it works, but it shows a square box for some reason. When I click the positions where the glyhicons are I can scroll through pictures so all that is not right is the appearance of the glyphicons the left and right arrow usually expected are not showing?
左右两个 V 字形字形没有显示，它可以工作，但由于某种原因它显示了一个方形框。当我点击 glyphicons 所在的位置时，我可以滚动图片，所以所有不正确的是 glyphicons 的外观通常预期的左右箭头没有显示？
<!DOCTYPE html>
<html>
<head>
<title>Student Association</title>
<link rel="stylesheet" href="css/bootstrap.min.css">
</head>
<body>
<div class="carousel slide" data-ride="carousel" id="carousel-ex">
<ol class="carousel-indicators">
<li class="active" data-slide-to="0" data-target="#carousel-ex"></li>
<li data-slide-to="1" data-target="#carousel-ex"></li>
<li data-slide-to="2" data-target="#carousel-ex"></li>
<li data-slide-to="3" data-target="#carousel-ex"></li>
<li data-slide-to="4" data-target="#carousel-ex"></li>
<li data-slide-to="5" data-target="#carousel-ex"></li>
</ol>
<div class="carousel-inner">
<div class="item active"><img alt="abuja" class="img-responsive" id=
"afCountries" src="img/african-countries/abuja-nigeria.jpg">
<div class="carousel-caption">
<h3>Abuja, Nigeria</h3>
</div>
</div>
<div class="item"><img alt="accra" class="img-responsive" id="afCountries" src=
"img/african-countries/accra-ghana.jpg">
<div class="carousel-caption">
<h3>Accra, Ghana</h3>
</div>
</div>
<div class="item"><img alt="kigali" class="img-responsive" id="afCountries"
src="img/african-countries/kigali-rwanda.jpg">
<div class="carousel-caption">
<h3>Kigali, Rwanda</h3>
</div>
</div>
<div class="item"><img alt="durban" class="img-responsive" id="afCountries"
src="img/african-countries/durban-southafrica.jpg">
<div class="carousel-caption">
<h3>Durban, South Africa</h3>
</div>
</div>
<div class="item"><img alt="Johannesburg" class="img-responsive" id=
"afCountries" src="img/african-countries/Johannesburg-South_Africa.jpg">
<div class="carousel-caption">
<h3>Johannesburg, South Africa</h3>
</div>
</div>
<div class="item"><img alt="kenya" class="img-responsive" id="afCountries" src=
"img/african-countries/kenya.jpg">
<div class="carousel-caption">
<h3>Kenya</h3>
</div>
</div>
</div>
<a class="left carousel-control" data-slide="prev" href=
"#carousel-ex"><span class="glyphicon glyphicon-chevron-left"></span></a>
<a class="right carousel-control" data-slide="next" href=
"#carousel-ex"><span class=
"glyphicon glyphicon-chevron-right"></span></a>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> </script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"> </script>
</body>
</html>
回答by Tim Lewis
Similar to Jyrkim, your solution works for example editors like Bootply and JSFiddle. My only thought is that you're missing the fonts section of your bootstrap folder. White Squaresis a placeholder for a character that can't be found in the current font type, like a special character in a custom font. It may render as []instead of something like *or &. Make sure your folder structure in Bootstrap is set up as follows:
与 Jyrkim 类似，您的解决方案适用于 Bootply 和 JSFiddle 等编辑器。我唯一的想法是您缺少引导程序文件夹的字体部分。White Squares是在当前字体类型中找不到的字符的占位符，例如自定义字体中的特殊字符。它可能呈现为[]而不是像*或这样的东西&。确保您在 Bootstrap 中的文件夹结构设置如下：
bootstrap
-> css
-> bootstrap-theme.css
-> bootstrap-theme.css.map
-> bootstrap-theme.min.css
-> bootstrap.css
-> bootstrap.min.css
-> theme.css
-> fonts
-> glyphicons-halflings-regular.eot
-> glyphicons-halflings-regular.svg
-> glyphicons-halflings-regular.ttf
-> glyphicons-halflings-regular.woff
-> js
-> bootstrap.js
-> bootstrap.min.js
I would bet any money that the fontsfolder is not there, or not linked properly. If your folder structure is the same as above, you can link the .css file like so:
我敢打赌该fonts文件夹不存在，或者没有正确链接。如果你的文件夹结构和上面一样，你可以像这样链接 .css 文件：
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
Hope that helps!
希望有帮助！
Note
笔记
Using the CDN version of the style sheet will cause this to not be an issue, but may increase load time.
使用样式表的 CDN 版本将不会导致此问题，但可能会增加加载时间。
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
