关于瀑布流

最近公司新上线的O2O网站，首页就是大量的图片和简单的介绍。我总感觉自己做了个瀑布流，可是上网查了一下，感觉还是不一样的，主要可能我这个就是太简单了。呵呵

我的伪瀑布流的图片的像素没有要求很高，所以瀑布流的照片首先就要漂亮，可能就达不到。其次瀑布流的图片都规定宽度，但不限制高度的。我的宽度，高度都规定成一致的，

其实比较像团购那样，一列一列，但是列的数量是没有限制的，可以适应屏幕。最少两列，最多，就要看你的屏幕有多宽了。

主要神奇的地方就是所有的放图片的box都是float:left；来一个固定的宽度，给最外围的包裹层设置一个min-width:就可以实现浏览器缩放时最少实现的列数了。

当然，比较美的最好的实现方式还是js，可是估计会很耗性能，所以不是专门做瀑布流的网站，也没有必要用了。

不过，发现了引发瀑布流的鼻祖，Pinterest，真的是很不错，很美的一个网站。喜欢阿。

看看我实习的伪瀑布流代码：

.box-list-left {//外层的box

float:left;

width:260px;//外层min-width：770px;所以最少可以容下两列

margin:10px 10px 0px 0px;//图片之间的间隙

}

.box-cont {//包裹图片和其他信息的box

border:1px solid #DEDEDE;

padding:10px;

min-height:410px;//图片规定了高度

}

好简单阿。。。