我們在實際工作中常會遇到需要設置水平居中的場景，比如為了美觀，文章的標題一般都是水平居中顯示的。
這里我們又得分兩種情況：行內元素 還是 塊狀元素 ，塊狀元素里面又分為定寬塊狀元素，以及不定寬塊狀元素。今天我們先來了解一下行內元素怎么進行水平居中？
如果被設置元素為文本、圖片等行內元素時，水平居中是通過給父元素設置 text-align:center 來實現的。(父元素和子元素：如下面的html代碼中，div是“我想要在父容器中水平居中顯示”這個文本的父元素。反之這個文本是div的子元素 )如下代碼：
html代碼：
<body> <div class="txtCenter">我想要在父容器中水平居中顯示。</div> </body>
css代碼：
<style>
.txtCenter{
text-align:center;
}
</style>
我來試試：把右側的圖片設置為水平居中顯示。（記得點擊右上角的全屏按鈕查看效果哦?。?/span>
備注:這一小節沒有正確性驗證，請查看結果窗口，從而判斷輸入代碼是否正確。
參考代碼：
div.imgCenter{
text-align:center;
}
請驗證，完成請求
由于請求次數過多，請先驗證，完成再次請求
打開微信掃碼自動綁定
綁定后可得到
使用 Ctrl+D 可將課程添加到書簽
舉報