bootstrap轮播图 原点变为方块,Bootstrap 4-将轮播指示器更改为点

I am using Bootstrap 4 Beta 2 version to do a carousel. The code looks like below:

And the carousel indicator show as lines:

Is there a way I can change the indicators into dots instead of lines? I would assume it is an bootstrap option but I didn't find that relevant document. Do I need to write custom css for that?

解决方案

Yes, I think you need to write custom CSS for doing lines into dots.

You just need to override two properties (width and height) and add a new one, border-radius, to .carousel-indicators li.

Make width and height values equal eg: 10px each and give a border-radius of 100%.

.carousel-indicators li {

width: 10px;

height: 10px;

border-radius: 100%;

}