在網頁制作中，我們經常需要使用圖片來美化頁面，使其更具吸引力和可讀性。但是，有時候我們的頁面上的圖片順序并不盡如人意，這時就需要用到CSS來調整圖片的順序。 首先，我們需要為我們的圖片設置一個父級容器。在這個容器中，我們可以使用CSS的“flexbox”屬性來控制子元素（圖片）的順序。在父容器上添加以下CSS屬性： pre { display: flex; flex-direction: row; } 這樣就將子元素（圖片）放置在一行內，并按照默認的排列順序排列。 接下來，如果需要調整圖片的順序，可以使用CSS的“order”屬性。這個屬性接受一個整數值，代表子元素的順序。默認情況下，每個子元素的order值為0。 我們可以通過給每個子元素設置一個不同的order值來改變圖片的順序。例如，假設我們有三張圖片，我們想要讓第二張圖排在最前面。那么，添加以下代碼： pre { display: flex; flex-direction: row; } pre img:nth-child(2) { order: -1; } 此代碼將第二張圖片的order值設置為-1，使其排在第一張圖片之前。其他子元素（圖片）的順序不變。 除此之外我們可以使用其他一些 CSS 屬性來調整圖片的顯示效果，例如使用“align-self”來控制圖片在父容器中的垂直位置等。這些方法都很容易使用并對網頁設計的完美性和細節有很大幫助。 總之，可以看出在CSS中調整圖片順序變得十分簡單。通過使用“flexbox”和“order”屬性，我們可以輕松地控制頁面中的圖片，達到最終希望的布局效果。