在CSS中，圖片居中可以通過多種方式實現，一種常見的方法是使用flexbox布局，下面是一些示例代碼：

HTML代碼：

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

CSS代碼：

.image-container {
  display: flex;
  align-items: center;
  justify-content: center;
}

在這個示例中，我們創(chuàng)建了一個名為image-container的div元素，用于包含圖片，我們使用display: flex將其轉換為flexbox布局。align-items: center和justify-content: center屬性將圖片在容器內水平和垂直居中。

我們還可以使用CSS的position屬性來實現圖片居中，下面是一個示例：

HTML代碼：

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

CSS代碼：

.image-container {
  position: relative;
}
.image-container img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

在這個示例中，我們將image-container元素的position屬性設置為relative，這將使其成為圖片的參考點，我們將圖片的position屬性設置為absolute，并將其top和left屬性設置為50%，這將使圖片在容器內水平和垂直居中，我們使用transform: translate(-50%, -50%)屬性將圖片進一步調整，以確保其在容器內完全居中。