jquery - 一张一张地填充瓷砖，甚至不同的宽度和高度

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