若是普通的css新增左右margin,則紅色盒子之間的距離會比紅色盒子與父元素的距離大兩倍。
若是只新增左邊距，則最右邊的紅色盒子和父元素貼在一起了。其實這裡可以另外給父元素新增內邊距，但是這樣要確定紅色盒子數量和margin的大小
解決這個布局的前提是：
方法：父元素寬度=子元素 x 個數 + 子元素margin x (個數+1)，然後給子元素新增左margin，因此，一行中剩餘的空間就是最右邊的margin,不用特意設定，直接在父元素用乙個flex-wrap換行，第一行中放不下，自然就轉到下一行。
//html
//css
section
.item
//js
//建立子元素
let con = document.getelementsbytagname('section')[0];
for (var i = 0; i < 20; i++)
size();
//定義布局方式
function
size
() [...itemlist].foreach(function(i)px`;
i.style.marginbottom = `$px`;
})}//頁面寬度發生變化時，重新呼叫，達到響應式的目的
window.onresize = function
()複製**
使用Masonry實現等間距布局
在ios開發的工程中，我們大部分都使用autolayout來實現布局，鑑於系統原生autolayout api提供的函式的複雜性和 量，我們實現乙個簡單的布局，往往需要大量的 才能實現。這個時候，基於autolayout封裝的第三方庫masonry的及時出現，解決了這個問題。只需要很少量的 我們即可...
CSS布局技巧
兩欄布局 左邊寬度固定，浮動。右邊設定margin left，寬度自適應。反之，亦可。例子 左邊 右邊 三欄布局 兩側浮動且寬度固定，左邊left浮動，右邊right浮動，中間設定margin left和margin right寬度自適應。注意，書寫順序是左右中。例子 左邊 右邊 中間 水平居中 方...
CSS布局奇淫技巧之
居中是我們使用css來布局時常遇到的情況。使用css來進行居中時，有時乙個屬性就能搞定，有時則需要一定的技巧才能相容到所有瀏覽器，本文就居中的一些常用方法www.cppcns.com做個簡單的介紹程式設計客棧。注 本文所講方法除了特別說明外，都是相容ie6 谷歌 火狐等主流瀏覽器的。先來說幾種簡單的...