CSS多個子框架居中的方法

歡迎大家在這裡學習CSS多個子框架居中!下面是我們給大家整理出來的精彩內容。希望大家在這裡學習!

有時我們需要令一個寬度固定的容器裡的子框架居中(例如一個Div ，或者其他block級元素)，如果子框架只有一個的話，我們只需要為子框架加上CSS屬性margin：auto就可以了。

但如果我們要讓多個子框架居中，並且等分父框架剩余的空間的話，我們對所有子框架使用CSS box-align： center 來實現這種效果。

可是目前還有相當一部分主流浏覽器不支持box-align屬性，那麼我們應該如何編寫CSS，使這種效果能兼容大部分的浏覽器呢?

通常的方法

為了使多個block級元素排列在同一行裡，我們習慣使用float 屬性使子框架浮動，然後利用margin屬性讓每一個子框架之間都留出一些空白的間距。可是這樣做會觸發經典的IE6雙倍margin BUG，這樣反而要投入額外的時間去調試IE6 的Hack。

雖然我們還可以通過display： inline來避開IE6的BUG，但我們仍然需要調整這些子框架間的間距，防止最後一個自框架被擠到下一行。

改變子框架級別並且控制剩余的空白

使用float和margin來讓多個子框架居中並且等分父框架剩余空間的做法缺點很多

好了，CSS多個子框架居中內容就給大家介紹到這裡了。希望大家繼續關注我們的網站!

相關推薦：

img標簽下多余空白BUG解決方法