瀑布流的演示地址https://luoyu6.github.io/waterfall/index.html
源码下载地址https://github.com/luoyu6/waterfall 其中js文件保存着图片的信息,是简单的json格式的数据,此处不粘贴了,小伙伴需要的可以去下载来看一下
以下是html文件:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="author" content="luoyu" />
<title>瀑布流</title>
<style type="text/css">
#wraper {
width: 1000px;
margin: 0 auto;
}
#wraper ul li {
margin: 0 auto;
list-style: none;
width: 265px;
float: left;
/*height: 1000px;*/
/*background: gray;*/
margin-left: 10px;
}
.dec {
display: block;
padding: 0 15px;
}
.time span{
display: block;
margin-bottom: 5px;
}
.time a:nth-child(2) {
float:left ;
}
.time a:nt