css3的出現，解決了不少前端的問題，比如動畫，圓角等；

?

這里總結一下css3 的多列布局；

w3c上給出了很多屬性；

我們一般用到column-count、column-gap、column-width這三個屬性，

其中column-count和column-width最好不要同時出現；

還有在規定的多列布局容器內的元素；要使用display：inline-block屬性；否則會出現脫節和錯亂；

例如：在暢游西城的項目中；

布局代碼如下

dl沒有使用display：inline-block屬性；導致下圖情況

?

調整后正常；

另有一個項目，按照如上設置后出現如下圖所示現象：

出現這個主要是每一項的寬度超出了規定的列寬度；

只要在列表每一項上增加width：100%就可以了；

?

轉載于:https://www.cnblogs.com/wwlhome/p/4649229.html

總結

以上是生活随笔為你收集整理的css3 多列布局使用的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。