在網(wǎng)站設(shè)計(jì)中，圖片展示是一個(gè)非常重要的環(huán)節(jié)。而在實(shí)現(xiàn)圖片展示的過(guò)程中，CSS 圖片廊更是一個(gè)十分常見(jiàn)的解決方案。然而，在圖片非常多的情況下，如何讓圖片能夠自動(dòng)換行成為了一個(gè)需要解決的問(wèn)題。 對(duì)此，我們可以使用 CSS3 中的 flex 布局來(lái)解決。這里是一段示例代碼：

.gallery {
display: flex;
flex-wrap: wrap;
}
.gallery img {
width: 200px;
height: 200px;
margin: 10px;
}

首先，我們給容器 .gallery 應(yīng)用了 flex 布局，并設(shè)置了 flex-wrap 屬性為 wrap。這個(gè)屬性的作用就是讓圖片能夠自動(dòng)換行，以滿足容器寬度不夠的情況。 接著，我們?cè)O(shè)置了每個(gè)圖片的寬度、高度和 margin 大小。這里的 margin 是為了讓圖片之間有一定的間距，以便提高視覺(jué)效果。 這樣，我們就成功實(shí)現(xiàn)了圖片自動(dòng)換行的效果。可以看到，當(dāng)容器寬度不夠時(shí)，圖片會(huì)自動(dòng)跳到下一行進(jìn)行展示。 總之，使用 flex 布局來(lái)實(shí)現(xiàn)圖片自動(dòng)換行是一種非常實(shí)用的解決方案，能夠提高網(wǎng)站的用戶體驗(yàn)，也是值得我們深入了解和學(xué)習(xí)的。