當被設置元素為 塊狀元素 時用 text-align：center 就不起作用了，這時也分兩種情況：定寬塊狀元素和不定寬塊狀元素。
這一小節(jié)我們先來講一講定寬塊狀元素。(定寬塊狀元素：塊狀元素的寬度width為固定值。)
滿足定寬和塊狀兩個條件的元素是可以通過設置“左右margin”值為“auto”來實現(xiàn)居中的。我們來看個例子就是設置 div 這個塊狀元素水平居中：
html代碼：
<body> <div>我是定寬塊狀元素，哈哈，我要水平居中顯示。</div> </body>
css代碼：
<style>
div{
border:1px solid red;/*為了顯示居中效果明顯為 div 設置了邊框*/
width:200px;/*定寬*/
margin:20px auto;/* margin-left 與 margin-right 設置為 auto */
}
</style>
也可以寫成：
margin-left:auto; margin-right:auto;
注意：元素的“上下 margin” 是可以隨意設置的。
我來試試看:這種水平居中的方法兩個2個條件缺一不可，不信？你可以嘗試把右側例子中的 width:200px 刪除，還它是否還可以居中顯示。（記得點擊右上角的全屏按鈕查看效果哦?。?/span>
請驗證，完成請求
由于請求次數(shù)過多，請先驗證，完成再次請求
打開微信掃碼自動綁定
綁定后可得到
使用 Ctrl+D 可將課程添加到書簽
舉報