CSS排列圖片自動(dòng)換行是在網(wǎng)頁(yè)設(shè)計(jì)中常用的技巧之一。這種技巧允許在無(wú)需手動(dòng)調(diào)整排列的情況下，在網(wǎng)頁(yè)上顯示大量的圖片，尤其在網(wǎng)站設(shè)計(jì)時(shí)，常常用來(lái)呈現(xiàn)人物簡(jiǎn)介、產(chǎn)品介紹、新聞圖片等。

這種技巧可以通過CSS樣式表中的屬性來(lái)實(shí)現(xiàn)。為了使一組圖片自動(dòng)排列并在需要時(shí)自動(dòng)換行，我們可以使用CSS3設(shè)置屬性“column”來(lái)實(shí)現(xiàn)，該屬性可以設(shè)置列數(shù)，通過設(shè)置該屬性為auto，實(shí)現(xiàn)自動(dòng)分列。

.gallery {
column-count: auto;
}
.gallery img {
margin: 5px;
max-width: 100%;
height: auto;
display: block;
}

在上面的代碼中，我們首先指定帶有“.gallery”類的元素將采用自動(dòng)列數(shù)設(shè)置。其次，我們指定每個(gè)圖片元素應(yīng)具有5像素的外邊距，以及圖片寬度的最大值不超過列寬，高度自適應(yīng)。最后我們?cè)O(shè)置圖片要像塊級(jí)元素一樣顯示而不是原來(lái)的行內(nèi)元素。

通過這個(gè)簡(jiǎn)單的樣式設(shè)置，我們就可以實(shí)現(xiàn)網(wǎng)站頁(yè)面上圖片的自動(dòng)排列和自動(dòng)換行。在網(wǎng)站設(shè)計(jì)時(shí)，與這個(gè)類似的技巧還有很多，可以參考CSS樣式表中更多的屬性，更好地掌握網(wǎng)頁(yè)設(shè)計(jì)的技巧。