在網頁設計中，居中是非常重要的一種排版方式。無論是圖像還是文字，居中都是符合視覺美感和網頁規范的。下面我們來看一下如何使用 CSS 完成圖像和文字的居中排版。

居中圖像

要實現圖像居中，首先需要將圖像包裝在一個容器內。然后，設置容器的 CSS 樣式為：

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

以上 CSS 樣式使用了 flex 布局，通過 justify-content 和 align-items 屬性實現了容器內圖像的水平和垂直居中。

下面是一個完整的示例：

<div class="container">
<img src="image.jpg" alt="圖片">
</div>

居中文字

要實現文字居中，同樣需要將文字包裝在一個容器內。這時，設置容器的 CSS 樣式為：

.container {
text-align: center;
}

以上 CSS 樣式通過 text-align 屬性實現了容器內文字的水平居中。

下面是一個完整的示例：

<div class="container">
<p>這是一段文字</p>
</div>

需要注意的是，在頁面中多個元素的居中排版時，需要為每個元素的容器分別設置相應的 CSS 樣式。

以上就是關于 CSS 圖像與文字居中的介紹。希望本篇文章能對您有所幫助。