CSS3中文字居中顯示圖片的方法

在CSS3中，我們可以使用flexbox布局來實現(xiàn)文字居中顯示圖片的效果，下面是一個簡單的示例代碼：

HTML代碼：

<div class="container">
  <img src="image.jpg" alt="圖片">
  <div class="text">文本內(nèi)容</div>
</div>

CSS代碼：

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

在這個示例中，我們創(chuàng)建了一個名為container的div元素，并將其設(shè)置為flexbox布局，我們使用align-items屬性將圖片和文本元素垂直居中，使用justify-content屬性將圖片和文本元素水平居中，我們使用text-align屬性將文本內(nèi)容居中顯示。

需要注意的是，這種方法僅適用于CSS3支持的瀏覽器，為了確保圖片和文本元素始終保持在容器中居中顯示，我們需要確保HTML結(jié)構(gòu)中的其他元素不會干擾到容器的布局。