HTML裡怎麼使用margin 0 auto
- php中世界最好的语言原創
- 2017-11-23 17:56:079611瀏覽
margin是一個很重要的屬性，那麼在HTML裡怎麼使用margin 0 auto呢？我們今天就好好介紹一下margin:0 auto，下面給大家舉一個小列子
margin設定物件外邊距,如果我們給DIV設定一條邊框線(border)樣式後，在DW軟體即可看出margin設定值其實是在邊框外距離，此樣式設定物件（DIV）之間間距的樣式。
margin:0 auto作用語法
1、margin:0 auto介紹
margin:0 auto 設定物件上下間距為0，左右自動。
可分割：margin:0 auto 0 auto（上下）
也可分割為：margin-left:auto;margin-right:auto;margin-top:0;margin-bottom:0;
2、作用
對DIV設定margin:0 auto樣式，是為了讓DIV在瀏覽器中水平居中。佈局居中、水平居中，均加入margin:0 auto即可。
關節點：auto(自動、自適應)
假如一個DIV我們設定寬度為500px，然後設定margin:0 auto樣式後，假如你瀏覽器視窗寬度為1000px寬，這時候此DIV靠左和靠右間距為（auto）這個時候瀏覽器會自動辨別DIV靠左和靠右各250px寬度間距，此時這個DIV盒子自然而然就水平居中瀏覽器中。
為什麼要設定margin:0 auto？
設定此樣式讓DIV佈局水平居中於瀏覽器中，目的就是相容各大瀏覽器讓佈局居中。如果不加margin:0 auto CSS樣式，會造成佈局在有的瀏覽器中居中有的瀏覽器靠左。
禁：如果要讓DIV佈局居中瀏覽器中，加入margin:0 auto就不能加入float浮動樣式，避免邏輯錯誤，造成佈局居中不相容。
相信透過我們的介紹，你對於margin 0 auto這個屬性已經很熟練的掌握了，更多精彩請關注php中文網其它相關文章！
相關閱讀：
以上是HTML裡怎麼使用margin 0 auto的詳細內容。更多資訊請關注PHP中文網其他相關文章！