異なる幅と高さでも1つずつ異なるタイルを塗りつぶします

Question

イメージを参照してください、私は一度問題を認識していると思います。

このタイルは、UL、LIリスト、およびDIVのセットの2つの方法でテストされましたが、どれも成功していませんでした。私はfloat：leftを追加しましたが、見ての通り、3番目の行では、背の高いタイルの後ろに4番目の行の項目は空白になりません。

正しい意味ではなく、グーグルで名前を変更してくださいが、見つからない場合は、キーワードが豊富になるようにしてください。私を案内してください。私はこのような設計にJQuery Masonryを使用

Answer 1

。

CSSをJQueryと一緒に使用すると、必要なものを簡単に手に入れることができます。

Answer 2

html

<table border="1"> 
    <tr> 
     <td></td> 
     <td></td> 
     <td></td> 
    </tr> 
    <tr> 
    <td colspan=2></td> 
    <td></td> 
    </tr> 
    <tr> 
    <td></td> 
    <td></td> 
    <td rowspan=2></td> 
    </tr> 
    <tr> 
    <td colspan=2></td> 
    </tr> 
    <tr> 
     <td></td> 
     <td></td> 
     <td></td> 
    </tr> 
</table>​ 

css

table {background:black;} 
td {background:blue;width:40px;height:40px;}​