逐个填充瓷砖，甚至不同的宽度和高度

Question

请参考图片，我想一旦你意识到这个问题。

我用两种方式测试了这个瓷砖，比如UL，LI列表和一组DIV，但都没有成功。我刚刚添加了float：left但是如你所见，在第三行中，在高大的瓷砖之后，第四行项目没有填充到空间。

请更改名称，如果不正确的意思和谷歌搜索但找不到应该是我的关键字想要丰富。请指导我。

Answer 1

我使用JQuery Masonry进行这样的设计。

使用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;}​