Question

在线急求。。。如何排列成上下挫乱的排列方式 如下图【数据需要从后台调用，所以每个div的高度不能设死

Answer 1

四个div控制4列,float:left; width:25%;
然后向每个div里填充内容就行了,只要内容长短不同,就会出现这种错落的效果.

追问

我用的这样方式，但是从第二排开始，排版就会错乱呀

能否解决一下。。。

追答

如果用我上面提的方法,只向那四个div中填充内容就不会有这样的问题了.

追问

• 这样，asp获取数据的时候，是不是麻烦些？。。。。。

追答

麻烦倒还不至于,但如果以前是顺序输出的话,现在可能要改变一下输出方式,比如定义四个变量,然后循环依次向每个变量后追加一组内容.这也是比较简单易行的方法.
但通常这样的布局都是由前端JS来实现加载的,但这样会比上面的方法开发量大,而且需要考虑浏览器兼容性也是个比较令人头疼的问题,但多数使用此类布局的优秀站点大多用JS来完成布局和数据填充.

追问

谢谢。。。查看了一下。。。大多都用js搞定的呵呵。。。。。。。

Answer 2

这个我们称为“瀑布流”布局，网上有很多的实例，还有JQuery配合的缓存加载效果

追问

谢谢提醒。。。