CSS图像被子

tha*_*way 2 html javascript css html5 css3

所以我会试着说明我最喜欢这样的样子.我的图像每次都会有所不同,我希望它们像2行被子一样显示.这是一个丑陋的例子:

aaabbbbddddddddddhhhhhhhhh
aaabbbbddddddddddhhhhhhhhh
aaabbbbeeeeeggg  hhhhhhhhh
   bbbbeeeeeggg  hhhhhhhhh
ccccccccffffffffffggggiiiiii
ccccccccffffffffffggggkkkk
ccccccccffffffffff    kkkk
Run Code Online (Sandbox Code Playgroud)

我不知道这是否有意义,或者它是否真实可行.为了以类似代码的方式进行解释,我希望div不仅向左或向右浮动,而且如果有可用空间,也要在填充旁边的图像之前向下浮动.我不能使用绝对定位,因为不同的图像将在不同的实例中使用相同的css/html/javascript.

Mat*_*ens 7

有一个jQuery插件:jQuery Masonry.我不知道你的问题有任何简单的非jQuery解决方案.