【问题标题】:how to redesign bootstrap slider如何重新设计引导滑块
【发布时间】:2019-04-10 17:19:52
【问题描述】:

我正在尝试更改“轮播”上一个和下一个的设计,我尝试使用此代码

.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>

【问题讨论】:

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


    【解决方案1】:

    改变了轮播prev和next的设计...有什么问题?

    编辑 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>

    【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2016-02-02
    • 2018-03-29
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-12-01
    • 2019-05-22
    • 1970-01-01
    相关资源
    最近更新 更多