在網頁設計中，經常需要展示多張圖片，如何讓這些圖片能夠快速、簡單地翻動呢？采用HTML編寫多圖片翻動的代碼，可以讓網頁的設計更加美觀。以下是具體步驟：

<div class="slider"><img src="1.jpg" alt="pic1"><img src="2.jpg" alt="pic2"><img src="3.jpg" alt="pic3"><img src="4.jpg" alt="pic4"></div><style>.slider {
width: 500px;
height: 300px;
overflow: hidden;
}
.slider img {
width: 100%;
height: 100%;
float: left;
}
</style>

代碼解釋：

1. 使用<div>標簽，設置class為“slider”，表示這個div是圖片輪播器的容器。

2. 在容器內部添加<img>標簽，分別引入要展示的圖片。

3. 在容器的樣式中，設置寬度、高度和溢出隱藏，只顯示容器區域內的圖片。

4. 對于標簽的樣式，設置寬度、高度和浮動，保證每張圖片占據容器的全部面積，并且浮動在左側。

使用以上代碼，頁面可以實現多張圖片的簡單翻頁，增強用戶體驗。