轮播图html代码

以下是一个简单的轮播图的 HTML 代码示例：

<div class="slideshow-container">
  <div class="mySlides fade">
    <img src="image1.jpg" style="width:100%">
  </div>

  <div class="mySlides fade">
    <img src="image2.jpg" style="width:100%">
  </div>

  <div class="mySlides fade">
    <img src="image3.jpg" style="width:100%">
  </div>

  <a class="prev" onclick="plusSlides(-1)">&#10094;</a>
  <a class="next" onclick="plusSlides(1)">&#10095;</a>
</div>

<script>
  var slideIndex = 1;
  showSlides(slideIndex);

  function plusSlides(n) {
    showSlides(slideIndex += n);
  }

  function showSlides(n) {
    var i;
    var slides = document.getElementsByClassName("mySlides");
    if (n > slides.length) {slideIndex = 1}
    if (n < 1) {slideIndex = slides.length}
    for (i = 0; i < slides.length; i++) {
        slides[i].style.display = "none";
    }
    slides[slideIndex-1].style.display = "block";
  }
</script>

以上代码包含了一个 `slideshow-container` 容器，和三个图片轮播的 `mySlides` 元素。通过 `plusSlides(n)` 和 `showSlides(n)` 函数，实现了向前和向后切换图片的功能。同时，通过 CSS 样式，可以定义容器的宽度、高度、背景颜色、字体大小等等。