twitter-bootstrap Bootstrap 轮播 - 样式分页点
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/22696287/
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 carousel - style pagination dots
提问by settheline
I have a Bootstrap 3 carousel that has 3 images with white background. My pagination dots are lost now, given that they have a white border with a transparent center (in my case, white as well). How can I use CSS to style these to a darker color? Thanks in advance!
我有一个 Bootstrap 3 旋转木马，它有 3 个白色背景的图像。我的分页点现在丢失了，因为它们有一个带有透明中心的白色边框（在我的情况下，也是白色的）。如何使用 CSS 将这些样式设置为较深的颜色？提前致谢！
Here's my carousel inner (pretty standard):
这是我的旋转木马内部（非常标准）：
<div class="carousel-inner">
<div class="item active">
<img src="images/img1.png" alt="img1">
<div class="carousel-caption">
<h3>...</h3>
</div>
</div>
<div class="item">
<img src="images/img2.png" alt="img2">
<div class="carousel-caption">
<h3>...</h3>
</div>
</div>
<div class="item">
<img src="images/img3.png" alt="img3">
<br>
<div class="carousel-caption">
<h3>...</h3>
</div>
</div>
</div>
回答by Hughes
Looking at the markup you provided, I don't see the indicators. Make sure that you have the following markup present in your slideshow.
查看您提供的标记，我没有看到指标。确保幻灯片中有以下标记。
<ol class="carousel-indicators">
<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
<li data-target="#carousel-example-generic" data-slide-to="1"></li>
<li data-target="#carousel-example-generic" data-slide-to="2"></li>
</ol>
To change the indicator colors you will need to change it in two different places. The first is the general indicator color which will change all of them. The second is the color of the indicator for the active slide.
要更改指示器颜色，您需要在两个不同的地方更改它。第一个是通用指示器颜色，它将改变所有颜色。第二个是活动幻灯片的指示器颜色。
.carousel-indicators li {
background: #ccc;
}
.carousel-indicators .active {
background: #666;
}
