在css中新手遇見的置中問題

標籤：設定   2-2   遇見   margin   family   mic   alt   對齊   16px   

     text-align 屬性是規定元素中的文本的水平對齊。然後當我們需要讓一個元素中的常值內容置中時就會給改元素添加一個text-align:center屬性，但是我們初學者在實際操作中需要給某元素（例如div1）裡面的所有內容都置中時，我們也會直接給div1添加text-align:center屬性，這時候會發現並不是所有的元素都置中了...

例如下面的代碼中：

運行效果如下：

可以看出父元素div裡面的子項目div貌似置中了，其實不然，因為我的子項目div沒有設定寬高

審查元素可以看出

現在給div加一個寬度，

 

 運行效果如下，

發現父元素div裡面的text-align：center屬性並沒有生效

那麼我把子項目div換成內嵌元素span,看看效果，

 

 

通過審查元素可以發現，span被置中了，說明text-align：center；這個屬性不僅對文本有用，對於父元素中的內聯子項目也是有用的。當給span加一個寬高屬性時，就變得不能置中，因為這事span已經變成區塊層級元素了

總結一下新手經常會遇到的置中問題，讓子項目在父元素中水平置中，一般用text-align：center屬性來規定文本和內嵌元素的水平置中，如果想讓區塊層級元素置中對齊一般使用margin：0 auto；

    （註：使用text-align：center屬性在IE7以及IE7以下版本的瀏覽器中時可以置中的，但在IE8及以上版本的瀏覽器或者其他標準的瀏覽器中是沒有效果的）

在css中新手遇見的置中問題