我正在使用Bootstrap 4 Beta 2版本来做一个旋转木马。代码如下所示:
<ol class="carousel-indicators">
<li data-target="#mycarousel" data-slide-to="0" class="active"></li>
<li data-target="#mycarousel" data-slide-to="1" ></li>
<li data-target="#mycarousel" data-slide-to="2" ></li>
</ol>
有没有一种方法可以让我把指示器变成点而不是线？我会假设它是一个引导选项，但我没有找到相关的文档。我需要为此编写自定义css吗？
是的，我认为您需要编写自定义CSS来将线转换为点。
您只需要重写两个属性(宽度和高度)并向添加一个新属性。边框半径。轮播指示器LI
使宽度和高度值相等，例如:10px，并给出100%的边框半径。
.carousel-indicators li {
width: 10px;
height: 10px;
border-radius: 100%;
}
您只需更改图标路径（如果有的话），使用inspect元素就可以获得类名。我使用Mozilla获取类名，然后使用两个svg图标将默认图标更改为自定义图标。
.carousel-control-prev-icon {
background-image: url("images/carousel/back.svg");
}
.carousel-control-next-icon {
background-image: url("images/carousel/next.svg");
}
我必须加上。旋转木马才能正常工作。
.carousel .carousel-indicators li {
width: 10px;
height: 10px;
border-radius: 100%;
}
