如何重新设计引导滑块

时间:2019-04-10 17:19:53

标签: jquery css twitter-bootstrap bootstrap-4 slider

我正在尝试通过新代码更改“旋转木马”的设计,然后尝试使用新代码

.carousel-control-prev {
  content: 'prev';
  font-size: 55px;
  color: red;
}
<a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
  <span class="carousel-control-next-icon" aria-hidden="true"></span>
  <span class="sr-only">Next</span>
</a>

我想做的是:

<a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
  <span class="swiper-button-prev swiper-button-white" aria-hidden="true">
      <div class="swiper-button-prev swiper-button-white">prev</div>
  </span>
  <!--
  <span class="sr-only">Previous</span>
  -->
</a>

1 个答案:

答案 0 :(得分:0)

更改了上一转盘和下一转盘的设计...出了什么问题?

编辑2:为箭头插入HTML实体。删除文字装饰

.carousel-control {
  font-size: 55px;
  color: red;
  text-decoration: none;
}
<a class="carousel-control-prev carousel-control" href="#carouselExampleControls" role="button" data-slide="prev">
  <span class="swiper-button-prev swiper-button-white" aria-hidden="true">
    <div class="swiper-button-prev swiper-button-white">&rsaquo;</div>
  </span>
</a>

 <a class="carousel-control-next carousel-control" href="#carouselExampleControls" role="button" data-slide="next">
  <span class="carousel-control-next-icon" aria-hidden="true"></span>
  <span class="sr-only">&lsaquo;</span>
</a>