查看“模板:轮播图”的源代码

<div class="carousel">
  <div class="carousel-images">
    {{#ask: [[Category:Images]]
      |?image
      |?link
      |format=template
      |template=轮播图模板
      |limit=10
    }}
  </div>
  <div class="prev" onclick="moveSlide(-1)"><</div>
  <div class="next" onclick="moveSlide(1)">></div>
  <div class="indicators">
    {{#ask:[[Category:Images]]
      |format=template
      |template=指示器
      |limit=10
    }}
  </div>
</div>
{{#css:.carousel {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 300px;
}
.carousel-images {
  display: flex;
  transition: transform 0.5s ease;
}
.slide {
  min-width: 100%;
  box-sizing: border-box;
}
div.prev, div.next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background-color: rgba(255, 255, 255, 0.5);
  border: none;
  cursor: pointer;
}
div.prev {
  left: 0;
}
div.next {
  right: 0;
}
.indicator {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 5px;
  background-color: gray;
  border-radius: 50%;
  cursor: pointer;
}
}}