zoukankan      html  css  js  c++  java
  • PC端布局02

     1 <html lang="en">
     2 
     3 <head>
     4     <meta charset="UTF-8">
     5     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     6     <meta http-equiv="X-UA-Compatible" content="ie=edge">
     7     <title>PC端布局</title>
     8     <style>
     9         * {
    10             margin: 0;
    11             padding: 0;
    12         }
    13         
    14         .top,
    15         .banner,
    16         .main,
    17         .footer {
    18             width: 960px;
    19             margin: 0 auto;
    20             border: 1px dashed #cccccc;
    21             text-align: center;
    22             background: pink;
    23         }
    24         
    25         .top {
    26             height: 120px;
    27         }
    28         
    29         .banner {
    30             height: 150px;
    31         }
    32         
    33         .main {
    34             height: 400px;
    35         }
    36         
    37         .left {
    38             width: 360px;
    39             height: 400px;
    40             background: rebeccapurple;
    41             float: left;
    42         }
    43         
    44         .right {
    45             width: 590px;
    46             height: 400px;
    47             float: right;
    48             background: honeydew;
    49         }
    50         
    51         .footer {
    52             height: 80px;
    53         }
    54     </style>
    55 </head>
    56 
    57 <body>
    58     <div class="top">top</div>
    59     <div class="banner">banner</div>
    60     <div class="main">
    61         <div class="left">left</div>
    62         <div class="right">right</div>
    63     </div>
    64     <div class="footer">footer</div>
    65 </body>
    66 
    67 </html>

  • 相关阅读:
    正则表达式
    iOS获取设备型号、设备类型等信息
    Dubbo-Zookeeper安装
    CentOS-常用安装
    多线程-线程通信
    JVM-高效并发
    静态代理与JDK动态代理
    JVM-类加载机制
    RPC原理及实现
    JVM-自动内存管理机制
  • 原文地址:https://www.cnblogs.com/yuanxiangguang/p/11319408.html
Copyright © 2011-2022 走看看