在 web 開發(fā)中，CSS 不僅可以控制文本和布局，還可以用來控制對圖片的呈現(xiàn)方式。其中，使用 CSS 實現(xiàn)圖片多行多列展示是一種非常常見的需求。

.container {
width: 100%;
display: flex;
flex-wrap: wrap;
}
.item {
width: 25%;
padding: 10px;
box-sizing: border-box;
}
.item img {
display: block;
width: 100%;
height: auto;
}

首先，需要在 HTML 頁面中創(chuàng)建一個容器，用于包含多個圖片展示項。在 CSS 中設(shè)置該容器的寬度為 100% 以占據(jù)整個屏幕的寬度，并在其中使用 flex 布局方式進行排列。由于要在一個容器內(nèi)排列多個圖片，為了方便調(diào)整，可以通過設(shè)置 flex-wrap 屬性將圖片展示在多行中。

而對于圖片展示項，我們需要設(shè)置寬度為 25%，這樣就可以使其在同一行內(nèi)排列出四個。同時，設(shè)置內(nèi)邊距和盒子模型的計算方式為 box-sizing: border-box，可以確保不會因為添加內(nèi)邊距而導(dǎo)致寬度發(fā)生變化。

接下來，我們?yōu)?img 標(biāo)簽設(shè)置了 display 屬性為 block，用于使其成為塊級元素，方便調(diào)整其尺寸。同時，設(shè)置 img 的寬度為 100%，可以讓它將父元素的寬度全部占用，從而自適應(yīng)屏幕大小。而高度則設(shè)置為 auto，可以使其按比例進行縮放。

通過以上的 CSS 代碼，我們就可以很方便地實現(xiàn)多行多列的圖片展示效果。同時，我們還可以對其進行更多的調(diào)整，比如添加間距等。