我试图制作一个只包含文字的旋转木马。旋转木马/滑块现在运行良好,它也有响应。现在我对指标的位置存在一些问题。
这里是a JSFiddle和我的CSS代码。希望你能帮帮我
#about .carousel-control{
color: #2db4a0;
background-image: none;
}
#about .carousel-indicators li{
border: none;
background-color: #424242;
}
#about .carousel-indicators .active{
background-color: #2DB4A0;
}
如您所见,指标在文中。我怎么能把它们放在文本下面。我希望得到你的帮助
答案 0 :(得分:1)
如果您想从文本中删除侧面指示符,请使用边距左右移动它们。将此代码添加到您的css文件中:
.carousel-inner>.item {
margin: 0 50px;
}
left carousel-control {
margin-left: -15px;
}
right carousel-control {
margin-right: -15px;
}
还有一些查询会更改指标,具体取决于分辨率,这就是为什么您需要在每个查询下使用上述值的原因。
对于底部指标,将底部边距添加到body标签,因为它们的位置是绝对的,所以你需要将它们推到底部:
body {
margin-bottom: -50px;
}
.carousel-indicators {
bottom: -30px;
}
这是一个更新的项目: https://jsfiddle.net/ydf5uuLm/4/