CSS中，我們可以使用flex布局來讓圖片在交叉軸上居中，下面是一個(gè)示例代碼：

HTML結(jié)構(gòu)：

<div class="container">
  <img class="image" src="path/to/image.jpg" alt="Image">
</div>

CSS樣式：

.container {
  display: flex;
  justify-content: center; /* 在水平方向上居中 */
  align-items: center; /* 在垂直方向上居中 */
  height: 100vh; /* 設(shè)置容器高度為視口高度 */
}
.image {
  max-width: 100%; /* 設(shè)置圖片***大寬度為容器寬度 */
  height: auto; /* 設(shè)置圖片高度為自動(dòng) */
}

在這個(gè)示例中，我們創(chuàng)建了一個(gè)名為container的容器，該容器使用flex布局，通過設(shè)置justify-content屬性為center，我們可以讓圖片在水平方向上居中，同樣地，通過設(shè)置align-items屬性為center，我們可以讓圖片在垂直方向上居中，為了讓圖片能夠自適應(yīng)容器的大小，我們還設(shè)置了圖片的***大寬度為容器寬度，高度為自動(dòng)，這樣，圖片就可以根據(jù)容器的大小來自動(dòng)調(diào)整自己的大小了。