zoukankan      html  css  js  c++  java
  • 瀑布流

    <!doctype html>
    <html>

    <head>
    <meta charset="utf-8">
    <title>瀑布流</title>
    <style>
    .box{
    1000px;
    border: 1px solid red;
    margin: auto;
    display: block;
    }
    .img-wrap34{
    column-gap: 15px;
    -moz-column-gap: 15px;
    -webkit-column-gap: 15px;
    -moz-column-count:5; /* Firefox */
    -webkit-column-count:5; /* Safari and Chrome */
    column-count:5;
    }
    .img-wrap34 div img{
    200px;
    }
    </style>
    </head>

    <body>
    <div class="box">
    <div class="img-wrap34">
    <div><img src="img/img1.jpg" /></div>
    <div><img src="img/img2.jpg" /></div>
    <div><img src="img/1.jpg" /></div>
    <div><img src="img/img1.jpg" /></div>
    <div><img src="img/img1.jpg" /></div>
    <div><img src="img/1.jpg" /></div>
    <div><img src="img/img2.jpg" /></div>
    <div><img src="img/img1.jpg" /></div>
    <div><img src="img/1.jpg" /></div>
    <div><img src="img/2.jpg" /></div>
    <div><img src="img/img2.jpg" /></div>
    <div><img src="img/img1.jpg" /></div>
    <div><img src="img/1.jpg" /></div>
    <div><img src="img/img2.jpg" /></div>
    <div><img src="img/2.jpg" /></div>
    <div><img src="img/img1.jpg" /></div>
    <div><img src="img/img2.jpg" /></div>
    <div><img src="img/img1.jpg" /></div>
    <div><img src="img/2.jpg" /></div>
    <div><img src="img/img1.jpg" /></div>
    <div><img src="img/img2.jpg" />
    </div>
    </div>
    </body>

    </html>

  • 相关阅读:
    软件工程实践个人编程作业
    实验 2:Mininet 实验——拓扑的命令脚本生成
    软工实践个人总结
    第08组 每周小结 (3/3)
    第08组 每周小结 (2/3)
    第08组 每周小结 (1/3)
    第08组 Beta冲刺 总结
    第08组 Beta冲刺 (5/5)
    第08组 Beta冲刺 (4/5)
    第08组 Beta冲刺 (3/5)
  • 原文地址:https://www.cnblogs.com/zhouyx/p/4860193.html
Copyright © 2011-2022 走看看