<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>瀑布流布局</title>
<link href="css/index.css" rel="stylesheet">
</head>
<body>
<div id="main">
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/0.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/1.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/2.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/3.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/4.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/5.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/6.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/7.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/8.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/9.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/10.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/11.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/12.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/13.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/14.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/15.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/16.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/17.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/18.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/19.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/20.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/21.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/22.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/23.jpg">
</div>
</div>
<!--*****************-->
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/24.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/25.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/26.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/27.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/28.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/29.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/30.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/31.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/32.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/33.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/34.jpg">
</div>
</div>
<!--单个图片-->
<div class="box">
<div class="pic">
<img src="images/354.jpg">
</div>
</div>
</div>
<script src="js/index.js" type="text/javascript"></script>
</body>
</html>
html瀑布流示例，可以做参考
需积分: 0 113 浏览量
2023-02-11
17:30:49
上传
评论
收藏 571KB ZIP 举报
06-瀑布流布局.zip （46个子文件） 
06-瀑布流布局 
.DS_Store 6KB js index.js 5KB css index.css 397B
index.html 6KB images 
40.jpg 13KB 2.jpg 11KB img_03.jpg 12KB 27.jpg 13KB 10.jpg 28KB 28.jpg 17KB 25.jpg 11KB 13.jpg 8KB 39.jpg 6KB 14.jpg 11KB 30.jpg 13KB 6.jpg 19KB 22.jpg 23KB 15.jpg 7KB 16.jpg 8KB 36.jpg 11KB 1.jpg 14KB 17.jpg 17KB 35.jpg 14KB 21.jpg 28KB 23.jpg 10KB 26.jpg 9KB 12.jpg 19KB 32.jpg 23KB 5.jpg 9KB 0.jpg 14KB 8.jpg 12KB 24.jpg 19KB 20.jpg 12KB 18.jpg 16KB 11.jpg 9KB 29.jpg 9KB 31.jpg 10KB 37.jpg 15KB 19.jpg 15KB 38.jpg 9KB 33.jpg 9KB 3.jpg 8KB 7.jpg 10KB 9.jpg 9KB 4.jpg 9KB 34.jpg 11KB资源评论
