Top of Header Slider image show <li> numbers in the webpage (Magento 1.7)

Question

I added a Header Slider image to the admin portal of Magento 1.7, but the number of <li> appears on my page. How can I hide the number of <li>? The following is my code in the admin portal of Magento 1.7:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">

<div class="container-" style="width: 100%;">
  <div id="myCarousel" class="carousel slide" data-ride="carousel">
    <ol class="carousel-indicators">
      <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
      <li data-target="#myCarousel" data-slide-to="1"></li>
      <li data-target="#myCarousel" data-slide-to="2"></li>
      <li data-target="#myCarousel" data-slide-to="3"></li>
    </ol>

    <!-- Wrapper for slides -->
    <div class="carousel-inner">
      <div class="item active">
        <img {{retinaurl data-img-src="wysiwyg/banner/ISQ_bigSlider1.png" data-img-srcX2="wysiwyg/banner/ISQ_bigSlider1.png" alt=""}}style="width: 100%; margin-right: 20px;">
      </div>

<div class="item active">
        <<img src="{{media url="wysiwyg/banner/ISQ_Safety_Glove_Poster_AprUpdated.jpg"}}" alt="" />}}style="width: 100%; margin-right: 20px;">
      </div>

    </div>

    <!-- Left and right controls -->
    <a class="left carousel-control" href="#myCarousel" data-slide="prev">
      <span class="glyphicon glyphicon-chevron-left"></span>
      <span class="sr-only">Previous</span>
    </a>
    <a class="right carousel-control" href="#myCarousel" data-slide="next">
      <span class="glyphicon glyphicon-chevron-right"></span>
      <span class="sr-only">Next</span>
    </a>
  </div>
</div>

Below is my output picture in my webpage, but will appear 1,2,3,4

Hope someone can guide me on how to solve this problem, or help to point out which part of my coding is getting errors. Thanks.