关于bootstarp的Carousel左右切换按钮背景颜色的去掉方法
在最近的项目中,用到了bootstarp的Carousel,但是却发现他左右两边有个灰色的阴影存在,让人看起来很别扭,百度完之后也没有找到解决办法,只好自力更生,处理方法如下:carousel如下所示:
在最近的项目中,用到了bootstarp的Carousel,但是却发现他左右两边有个灰色的阴影存在,让人看起来很别扭,百度完之后也没有找到解决办法,只好自力更生,处理方法如下:
carousel如下所示:
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<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>
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="img/photo11.jpg" alt="">
<div class="carousel-caption"><!--某公司所有--></div>
</div>
<div class="item">
<img src="img/photo12.jpg" alt="">
<div class="carousel-caption"><!--某公司所有--></div>
</div>
<div class="item">
<img src="img/photo13.jpg" alt="">
<div class="carousel-caption"><!--某公司所有--></div>
</div>
</div>
<!-- Controls -->
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
在样式表中加入:
<style>
.left{
text-shadow:none;
}
.carousel-control.right, .carousel-control.left{
background-image: none;
}
</style>
更多推荐
所有评论(0)