几行代码就可以轻松实现瀑布流展示

CSS代码*{padding:0px;边距：0px；列表样式：无；字体样式：正常；字体系列：宋体；字体系列：微软雅黑，arial;}.twoRankedBox{margin:6px8px;溢出：隐藏；padding-bottom:25px;}.twoRankedBoxul{宽度:49%;float:left;}.twoRankedBoxul:last-child{margin-left:2%;}.twoRankedBoxulli{padding:5px;底部边距：6px；底部填充：8px；背景颜色：#FFFFFF;}.twoRankedBoxullip:first-child{padding-top:0px;}.twoRankedBoxullip{padding-top:4px;}.product_pictureimg{display:block;宽度：100%；}.product_np{溢出：隐藏；行高：20px;}.product_npa{显示：b锁;溢出：隐藏；文本溢出：省略号；空白：nowrap;}.product_npa:first-child{字体大小：0.9em;颜色：#58b7e3；宽度：65%；向左飘浮;}。product_npa:last-child{字体大小:0.8em;颜色：#f00；浮动：对；宽度：35%；text-align:right;}.product_ie{字体大小:0.8em;颜色：#777；}JS代码//模拟JSON数据varjson={data:[{name:'花瓣',price:'128',details:'质量超级好舒服，夏天首选',src:'images/temporary/img_01.jpg'},{name:'时尚牛仔短裤',price:'298',details:'质量超级好，特别舒服，夏天首选。',src:'images/temporary/img_02.jpg'},{name:'白色婚纱',price:'668',details:'质量超级好，特别舒服，夏天首选。',src:'images/temporary/img_03.jpg'},{name:'绿色防晒衣',price:'218',details:'质量超级好，特别舒服，夏天首选。',src:'images/temporary/img_04.jpg'},{name:'格子裙',price:'88',details:'质量超级好，特别舒服，夏天首选。',src:'images/temporary/img_05.jpg'},{name:'复古旗袍',price:'128',details:'质量超级好，特别舒服，夏天首选。',src:'images/temporary/img_06.jpg'},{name:'花瓣花瓣裙',price:'128',details:'质量超级好，特别舒服，夏天穿首选。',src:'images/temporary/img_07.jpg'},{name:'时尚牛仔短裤',price:'298',details:'质量超级好，特别舒服，夏天首选。',src:'images/temporary/img_08.jpg'},{name:'白色婚纱',price:'668',details:'质量超级好，特别舒服，夏天首选。',src:'images/temporary/img_09.jpg'},{name:'绿色防晒衣',price:'218',details:'质量超级好，特别舒服，夏天首选。',src:'images/temporary/img_10.jpg'},{name:'格子迷你裙',price:'118',details:'质量超级好，特别舒服，夏天首选。',src:'images/temporary/img_11.jpg'}]}//模拟数据导入for(vari=0;i

'+''+json.data[i].name+'￥'+json.data[i].price+'

'+''+json.data[i].details+'

'if($('.BoxLeft').height()<$('.BoxRight').height()){$('.BoxLeft').append(chtml);}else{$('.BoxRight').append(chtml);}}