HTML幻燈片切換是網頁設計中經常用到的功能，通過制作幻燈片可以使網頁更加生動有趣。下面是一個簡單的HTML幻燈片切換的代碼示例：

HTML幻燈片切換示例：

<div class="slideshow-container">
<div class="mySlides fade">
<img src="slide1.jpg" style="width:100%;">
<div class="text">第一張幻燈片標題</div>
</div>
<div class="mySlides fade">
<img src="slide2.jpg" style="width:100%;">
<div class="text">第二張幻燈片標題</div>
</div>
<div class="mySlides fade">
<img src="slide3.jpg" style="width:100%;">
<div class="text">第三張幻燈片標題</div>
</div>
<a class="prev" onclick="plusSlides(-1)"></a>
<a class="next" onclick="plusSlides(1)"></a>
</div>
<br>
<div style="text-align:center">
<span class="dot" onclick="currentSlide(1)"></span> 
<span class="dot" onclick="currentSlide(2)"></span> 
<span class="dot" onclick="currentSlide(3)"></span> 
</div>

在這個代碼示例中，我們使用了一個div元素來包裹所有的幻燈片，class屬性設置為"slideshow-container"。在"slideshow-container"中，我們使用了三個div元素來包裹每一張幻燈片的圖片和標題，class屬性分別設置為"mySlides fade"。其中，fade類是為了實現淡入淡出的效果。 在每個幻燈片的div中，我們先添加了圖片元素，然后添加了一個div元素來顯示標題。在這個例子中，我們的幻燈片顯示的是三張不同的圖片和標題。 在幻燈片之間的切換上，我們添加了兩個鏈接元素，class屬性分別設置為"prev"和"next"。并且，我們使用了JavaScript函數"plusSlides(n)"來實現切換的功能。 最后，我們添加了另外一個div元素，用來實現幻燈片的圓點導航。每個圓點都是一個元素，class屬性設置為"dot"，并且使用了JavaScript函數"currentSlide(n)"來實現導航的點擊功能。 通過這個HTML幻燈片切換的代碼示例，我們可以看到制作一個基本的幻燈片切換并不需要太復雜的代碼，只需要一些HTML元素和JavaScript函數就可以實現。