부트스트랩(Bootstrap) 캐러셀(Carousel) 자동 슬라이드 이미지 사용법

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>

<div id="contents" class="container">
      <div id="randomCarousel" class="carousel slide" data-ride="carousel">
        <!--Indicator Buttons-->
        <ol class="carousel-indicators">
          <li data-target="#randomCarousel" data-slide-to="0" class="active"></li>
          <li data-target="#randomCarousel" data-slide-to="1"></li>
          <li data-target="#randomCarousel" data-slide-to="2"></li>
        </ol>
        <!--Carousel w/Images-->
        <div class="container">
          <div class="carousel-inner">
            <!--ALL PICS ARE PART OF CREATIVE COMMONS; ADDED SIMPLY FOR FUN-->
            <div class="carousel-item active">
              <img src="1.jpg" class="d-block w-100" alt="First">
            </div>
            <div class="carousel-item">
              <img src="2.jpg" class="d-block w-100" alt="Second">
            </div>
            <div class="carousel-item">
              <img src="3.jpg" class="d-block w-100" alt="Third">
            </div>
          </div>
        </div>
        <!--Next and Previous buttons-->
        <a class="carousel-control-prev" href="#randomCarousel" role="button" data-slide="prev">
          <span class="carousel-control-prev-icon" aria-hidden="true"></span>
          <span class="sr-only">Previous</span>
        </a>
        <a class="carousel-control-next" href="#randomCarousel" role="button" data-slide="next">
          <span class="carousel-control-next-icon" aria-hidden="true"></span>
          <span class="sr-only">Next</span>
        </a>
      </div>

위 예시 코드에서 img태그 링크만 변경해주면 기본 캐러셀 사용법 끝입니다.