zoukankan      html  css  js  c++  java
  • css盒子模型学习

    <head runat="server">
    <title></title>
    <style type="text/css">
    body
    {
    margin:0px;
    }
    .div1
    {
    800px;
    height:500px;
    border:1px solid #b4b4b4;
    margin-left:50px;
    margin-top:50px;

    }
    .img1
    {
    50px;
    height:50px;
    }
    .ul1
    {
    500px;
    height:400px;
    border:1px solid red;
    list-style-type :none;

    }
    .ul1 li
    {
    50px;
    height:50px;
    border:1px solid red;
    float:left;
    margin-left :10px;
    margin-top:5px;

    }
    </style>
    </head>
    <body>
    <form id="form1" runat="server">
    <div class="div1">
    <ul class="ul1">
    <li><img src="/NewFolder1/123.png" class="img1" /></li>
    <li><img src="/NewFolder1/123.png" class="img1" /></li>
    <li><img src="/NewFolder1/123.png" class="img1" /></li>
    <li><img src="/NewFolder1/123.png" class="img1" /></li>
    <li><img src="/NewFolder1/123.png" class="img1" /></li>
    <li><img src="/NewFolder1/123.png" class="img1" /></li>
    <li><img src="/NewFolder1/123.png" class="img1" /></li>
    <li><img src="/NewFolder1/123.png" class="img1" /></li>
    <li><img src="/NewFolder1/123.png" class="img1" /></li>
    <li><img src="/NewFolder1/123.png" class="img1" /></li>
    <li><img src="/NewFolder1/123.png" class="img1" /></li>
    <li><img src="/NewFolder1/123.png" class="img1" /></li>
    </ul>
    </div>
    </form>
    </body>
    </html>

    效果如下

  • 相关阅读:
    原生js实现简单的全屏滚动
    原生拖拽js利用localstorage保存位置
    vue组件利用formdata图片预览以及上传
    手机端原生js实现下拉刷新数据
    读啥技术服务支持
    涂鸦壁纸技术服务支持
    JAVA基础面试题
    JAVA编程入门
    DOS常用命令及进制转换
    JS基础(事件的绑定)
  • 原文地址:https://www.cnblogs.com/xu3593/p/2935904.html
Copyright © 2011-2022 走看看