HTML是一種用于創(chuàng)建網(wǎng)頁(yè)的標(biāo)記語(yǔ)言，通過(guò)HTML可以實(shí)現(xiàn)許多網(wǎng)頁(yè)的基本功能，例如創(chuàng)建圖片輪播。
下面是一個(gè)簡(jiǎn)單的HTML代碼實(shí)現(xiàn)圖片輪播的例子：
<html>
<head>
<title>圖片輪播</title>
<style>
/*設(shè)置圖片輪播容器的寬度和高度*/
.slideshow {
width: 500px;
height: 300px;
overflow: hidden;
}
/*設(shè)置圖片樣式*/
.slideshow img {
width: 500px;
height: 300px;
object-fit: cover;
}
</style>
</head>
<body>
<div class="slideshow">
<img src="1.jpg" alt="圖片1">
<img src="2.jpg" alt="圖片2">
<img src="3.jpg" alt="圖片3">
<img src="4.jpg" alt="圖片4">
</div>
<script>
//獲取圖片輪播容器和所有圖片元素
const slideshow = document.querySelector('.slideshow');
const images = document.querySelectorAll('.slideshow img');
//設(shè)置圖片索引和定時(shí)器
let index = 0;
setInterval(() => {
//隱藏當(dāng)前圖片
images[index].style.display = 'none';
//改變圖片索引
index = (index + 1) % images.length;
//顯示下一張圖片
images[index].style.display = 'block';
}, 3000);
</script>
</body>
</html>以上代碼中，首先使用CSS設(shè)置了圖片輪播容器的寬度和高度，以及每張圖片的寬度和高度。然后使用JavaScript獲取了圖片輪播容器和所有圖片元素，并設(shè)置了圖片輪播的定時(shí)器，實(shí)現(xiàn)輪播的功能。