Twitter bootstrap 如何在单击箭头时更改引导4卡鲁萨速度？

嗨，我正在Bootstrap4中开发一个应用程序。当我点击箭头时，默认的引导carousal速度太快，图像在点击箭头时从左向右滑动太快

我想在单击箭头时更改幻灯片的速度

这是我的幻灯片HTML：

<div id="carousel-area">
    <div id="carousel-slider" class="carousel slide" data-ride="carousel">
      <ol class="carousel-indicators">
        <li data-target="#carousel-slider" data-slide-to="0" class="active"></li>
        <li data-target="#carousel-slider" data-slide-to="1"></li>
        <li data-target="#carousel-slider" data-slide-to="2"></li>
      </ol>
      <div class="carousel-inner" role="listbox">
        <div class="carousel-item active">
          <img src="img/slider/bg-1.jpg" alt="">
          <div class="carousel-caption">
            <h1>Ultimate Solution for Your Website</h1>
          </div>
        </div>
        <div class="carousel-item">
          <img src="img/slider/bg-2.jpg" alt="">
          <div class="carousel-caption">
            <h1>Ultimate Solution for Your Website</h1>
          </div>
        </div>
        <div class="carousel-item">
          <img src="img/slider/bg-3.jpg" alt="">
          <div class="carousel-caption">
            <h1>Ultimate Solution for Your Website</h1>
          </div>
        </div>
      </div>
      <a class="carousel-control-prev" href="#carousel-slider" role="button" data-slide="prev">
        <i class="lnr  lnr-arrow-left"></i>
      </a>
      <a class="carousel-control-next" href="#carousel-slider" role="button" data-slide="next">
        <i class="lnr  lnr-arrow-right"></i>
      </a>
    </div>
  </div>

为您的网站提供终极解决方案
为您的网站提供终极解决方案
为您的网站提供终极解决方案

使用CSS更改

.carousel项目上
转换持续时间的速度。例如，这里是2秒

.carousel-item {
  transition-duration: 2s;
}

使用CSS更改
.carousel项目上
转换持续时间的速度。例如，这里是2秒

.carousel-item {
  transition-duration: 2s;
}