DIV CSS 佈局教程網

在項目中遇到了不規則圖片牆的布局問題 分析原理如下：

1.img display: block; 解決3px img標簽bug

2.img 設置height 和width 不然會出現 下面的圖片如果先加載上面的圖片再加載時 會推動圖片向下移動

3.父div position: relative; 讓圖片價格可以相對絕對定位

4.子span position: absolute; right: 5px; bottom: 5px; 讓價格絕對父div定位

5.為了實現效果 把圖片div放到3列大div裡

效果如下:

復制代碼代碼如下:
<div id=”main”></p> <p>　　<div class=”g1”></p> <p>　　　　<div class=”item”></p> <p>　　　　　　<img src=”” width=”” height=””/></p> <p>　　　　　　<span>價格</span></p> <p>　　　　</div></p> <p>　　　　.....</p> <p>　　</div></p> <p>　　<div class=”g2”></p> <p>　　</div></p> <p>　　<div class=”g3”></p> <p>　　</div></p> <p></div>