Carousel 轮播

<div class="pvs-carousel pvs-carousel--ratio-16x9" data-pvs-carousel data-pvs-carousel-autoplay="6000" style="max-width:32rem">
  <div class="pvs-carousel__viewport">
    <div class="pvs-carousel__track">
      <div class="pvs-carousel__slide is-active">
        <img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='640' height='360'%3E%3Crect fill='%232563eb' width='100%25' height='100%25'/%3E%3Ctext x='50%25' y='50%25' fill='white' font-size='32' text-anchor='middle' dominant-baseline='middle'%3E1%3C/text%3E%3C/svg%3E" alt="幻灯 1" />
      </div>
      <div class="pvs-carousel__slide">
        <img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='640' height='360'%3E%3Crect fill='%23059669' width='100%25' height='100%25'/%3E%3Ctext x='50%25' y='50%25' fill='white' font-size='32' text-anchor='middle' dominant-baseline='middle'%3E2%3C/text%3E%3C/svg%3E" alt="幻灯 2" />
      </div>
      <div class="pvs-carousel__slide">
        <img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='640' height='360'%3E%3Crect fill='%23d97706' width='100%25' height='100%25'/%3E%3Ctext x='50%25' y='50%25' fill='white' font-size='32' text-anchor='middle' dominant-baseline='middle'%3E3%3C/text%3E%3C/svg%3E" alt="幻灯 3" />
      </div>
    </div>
  </div>
  <button type="button" class="pvs-carousel__prev" aria-label="上一张">‹</button>
  <button type="button" class="pvs-carousel__next" aria-label="下一张">›</button>
  <div class="pvs-carousel__indicators" role="tablist" aria-label="幻灯指示">
    <button type="button" class="pvs-carousel__indicator is-active" aria-label="第 1 张">
    </button>
    <button type="button" class="pvs-carousel__indicator" aria-label="第 2 张">
    </button>
    <button type="button" class="pvs-carousel__indicator" aria-label="第 3 张">
    </button>
  </div>
</div>

<div class="pvs-carousel pvs-carousel--ratio-16x9" data-pvs-carousel style="max-width:24rem">
  <div class="pvs-carousel__viewport">
    <div class="pvs-carousel__track">
      <div class="pvs-carousel__slide is-active">
        <div class="pvs-carousel__caption">手动轮播 · 无 autoplay</div>
      </div>
      <div class="pvs-carousel__slide">
        <div class="pvs-carousel__caption">第二屏</div>
      </div>
    </div>
  </div>
  <button type="button" class="pvs-carousel__prev" aria-label="上一张">‹</button>
  <button type="button" class="pvs-carousel__next" aria-label="下一张">›</button>
</div>