こんにちは!kossyです!
今日はたまには技術的なことを
ブログに残してみようかと思いますー
最近買った
HTML5 CSS3 モダンコーディング
という本の中で、
グリッドレイアウトを
実装する章があったので、
その導入方法を紹介してみます!
<script src="http://cdnjs.cloudflare.com/ajax/libs/masonry/3.3.0/masonry.pkgd.js"> </script> <script> new Masonry('body', { itemSelecter: '.item', //ボックス要素のセレクタ columnWidth: 180, //グリッドの横幅 gutter: 4 //左右のボックスとの間隔 }); </script>
これでレンガのように
画像が隙間なく敷き詰められます!