• 盒子的多样式


     1 <!DOCTYPE html>
     2 <html>
     3 <head lang="en">
     4     <meta charset="UTF-8">
     5     <title></title>
     6 </head>
     7 <body>
     8     <div style="height: 40px;">
     9         <div style=" 1000px;margin: 0px auto">
    10             <div style=" 100px;height: 40px;float: left;"></div>
    11             <div style=" 100px;height: 40px;float: left;margin-left: 10px;"></div>
    12             <div style=" 100px;height: 40px;float: left;margin-left: 10px;"></div>
    13             <div style=" 80px;height: 40px;float: right;"></div>
    14             <div style=" 80px;height: 40px;float: right;margin-right: 10px"></div>
    15             <div style=" 80px;height: 40px;float: right;margin-right: 10px"></div>
    16             <div style=" 80px;height: 40px;float: right;margin-right: 10px"></div>
    17             <div style=" 80px;height: 40px;float: right;margin-right: 10px"></div>
    18             <div style="clear: both"></div>
    19         </div>
    20     </div>
    21     <div style="height: 20px"></div>
    22     <div style=" 1000px;margin: 0px auto">
    23         <div style=" 150px;height: 70px;float: left;"></div>
    24         <div style="float: left;padding-top: 21px;padding-left: 80px;">
    25             <div style=" 250px;height: 30px;"></div>
    26         </div>
    27         <div style=" 100px;height: 50px;float: right;"></div>
    28         <div style="float: left;padding-left: 300px;">
    29             <div style=" 100px;height: 50px;"></div>
    30         </div>
    31         <div style="clear: both"></div>
    32         <div style="height: 20px"></div>
    33         <div style=" 180px;height: 90px;float: left;">
    34             <div style="height: 30px;180px;">
    35                 <div style=" 30px;height: 20px;float: left;margin-left: 10px;margin-top: 5px;"></div>
    36                 <div style=" 30px;height: 20px;float: left;margin-left: 15px;margin-top: 5px;"></div>
    37                 <div style=" 30px;height: 20px;float: left;margin-left: 15px;margin-top: 5px;"></div>
    38                 <div style=" 30px;height: 20px;float: left;margin-left: 15px;margin-top: 5px;"></div>
    39                 <div style="clear: both"></div>
    40             </div>
    41             <div style="height: 30px;180px;">
    42                 <div style=" 30px;height: 20px;float: left;margin-left: 10px;margin-top: 5px;"></div>
    43                 <div style=" 30px;height: 20px;float: left;margin-left: 15px;margin-top: 5px;"></div>
    44                 <div style=" 30px;height: 20px;float: left;margin-left: 15px;margin-top: 5px;"></div>
    45                 <div style=" 30px;height: 20px;float: left;margin-left: 15px;margin-top: 5px;"></div>
    46                 <div style="clear: both"></div>
    47             </div>
    48             <div style="height: 30px;180px;">
    49                 <div style=" 30px;height: 20px;float: left;margin-left: 10px;margin-top: 5px;"></div>
    50                 <div style=" 30px;height: 20px;float: left;margin-left: 15px;margin-top: 5px;"></div>
    51                 <div style=" 30px;height: 20px;float: left;margin-left: 15px;margin-top: 5px;"></div>
    52                 <div style=" 30px;height: 20px;float: left;margin-left: 15px;margin-top: 5px;"></div>
    53                 <div style="clear: both"></div>
    54             </div>
    55         </div>
    56         <div style=" 180px;height: 90px;float: left;margin-left: 25px"></div>
    57         <div style=" 180px;height: 90px;float: left;margin-left: 25px"></div>
    58         <div style=" 180px;height: 90px;float: left;margin-left: 25px"></div>
    59         <div style=" 180px;height: 90px;float: left;margin-left: 25px"></div>
    60         <div style="clear: both"></div>
    61         <div style="height: 20px"></div>
    62         <div style=" 1000px;height: 30px;">
    63             <div style=" 100px; height: 20px;margin-top: 5px;float: left;margin-left: 20px;"></div>
    64             <div style=" 100px; height: 20px;margin-top: 5px;float: left;margin-left: 115px;"></div>
    65             <div style=" 100px; height: 20px;margin-top: 5px;float: left;margin-left: 115px;"></div>
    66             <div style=" 100px; height: 20px;margin-top: 5px;float: left;margin-left: 115px;"></div>
    67             <div style=" 100px; height: 20px;margin-top: 5px;float: left;margin-left: 115px;"></div>
    68             <div style="clear: both"></div>
    69         </div>
    70         <div style="height: 20px"></div>
    71         <div style="height: 80px;</div>
    72         <div style="height: 20px"></div>
    73         <div style=" 1000px;height: 30px;">
    74             <div style=" 100px; height: 20px;margin-top: 5px;float: left;margin-left: 20px;"></div>
    75             <div style=" 100px; height: 20px;margin-top: 5px;float: left;margin-left: 115px;"></div>
    76             <div style=" 100px; height: 20px;margin-top: 5px;float: left;margin-left: 115px;"></div>
    77             <div style=" 100px; height: 20px;margin-top: 5px;float: left;margin-left: 115px;"></div>
    78             <div style=" 100px; height: 20px;margin-top: 5px;float: left;margin-left: 115px;"></div>
    79             <div style="clear: both"></div>
    80         </div>
    81         <div style="height: 20px"></div>
    82         <div style=" 200px;height: 200px;float: left"></div>
    83         <div style=" 375px;height: 200px;float: left;margin-left: 25px">
    84             <div style="370px;height: 30px;float: right;margin-top: 6px; ">
    85                 <div style=" 50px; height: 20px;margin-top: 5px;float: left;margin-left: 20px;"></div>
    86                 <div style=" 50px; height: 20px;margin-top: 5px;float: left;margin-left: 20px;"></div>
    87                 <div style=" 50px; height: 20px;margin-top: 5px;float: left;margin-left: 20px;"></div>
    88             </div>
    89         </div>
    90         <div style=" 375px;height: 200px;float: left;margin-left: 25px"></div>
    91         <div style="clear: both"></div>
    92 
    93     </div>
    94 </body>
    95 </html>

    显示图:

  • 相关阅读:
    MYSQL分库分表
    MYSQL主从数据库
    mysql not in用法
    python 文件及目录操作
    python 读写文件
    python字符编码
    python类的继承、封装和多态
    python之定义类创建实例
    理解OSI参考模型
    python闭包与装饰器
  • 原文地址:https://www.cnblogs.com/dzlx/p/8029794.html
Copyright © 2020-2023  润新知