4

假设我们有一些块：

<div class="block"></div>

共有三种尺寸block：

<div class="block b1x1"></div>
<div class="block b2x1"></div>
<div class="block b1x2"></div>

例如b1x1是width:50px;height:50px;，b2x1是width:100px;height:50px;

现在假设我们的网站上有很多块，它们完全混合在一起：

<div class="block b1x1"></div>
<div class="block b2x1"></div>
<div class="block b2x1"></div>
<div class="block b1x1"></div>
<div class="block b1x1"></div>
<div class="block b2x1"></div>
<div class="block b1x2"></div>
<div class="block b2x1"></div>
.. etc

但是我们想让它们保持整洁，想象一下你用这个积木玩俄罗斯方块。

所以两个问题：

  1. 如何使用 CSS/JS 组织块结构？任何已知的算法/jquery 插件/解决方案？从哪儿开始？
  2. 当访问者更改浏览器窗口大小时该怎么办？（见图片）
  3. 更多尺寸呢（例如 3x4 等）

在此处输入图像描述

4

2 回答 2

3

jQuery Masonry怎么样？它用 jQuery 完成了你想要的。

于 2012-11-25T17:35:35.010 回答
2

试试 jquery 插件：masonry，随心所欲http://masonry.desandro.com/

于 2012-11-25T17:35:46.773 回答