zoukankan      html  css  js  c++  java
  • css做的后台管理页面,不考虑ie8一下的

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8" />
    <title>盒子模型</title>
    <style type="text/css">
    * {
        margin:0;
        padding:0;
    }
    html, body {
        height:100%;
        width:100%;
        overflow:hidden;
    }
    .wrap {
        height:100%;
        width:100%;
        overflow:hidden;
        padding:110px 0 70px;
        box-sizing:border-box;
    }
    .head {
        height:100px;
        background:#933;
        width:100%;
        margin:-110px 0 10px;
    }
    .body {
        height:100%;
        overflow:hidden;
        line-height:30px;
    }
    .bar {
        width:280px;
        height:100%;
        background:#9CF;
        float:left;
        overflow:auto;
        padding:0 10px;
    }
    .con {
        margin-left:310px;
        background:#6F6;
        height:100%;
        overflow:auto;
        padding:0 10px;
    }
    .foot {
        height:60px;
        background:#099;
        width:100%;
        margin-top:10px;
    }
    </style>
    </head>
    <body>
    <div class="wrap">
      <div class="head"></div>
      <div class="body">
        <div class="bar">
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
        </div>
        <div class="con">
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
          <p>asdasdas</p>
        </div>
      </div>
      <div class="foot"></div>
    </div>
    </body>
    </html>
  • 相关阅读:
    ACMer第7天Falling Ants
    贪心初步-FatMouse' Trade
    贪心初步-A
    ACM集训第二天
    asp.net中遍历套用母版页的页面的控件
    a 标签中调用js的几种方法
    笔记
    html控件和web控件
    ASP.NET中GUID类
    (转)常见邮件服务器(接收服务器和发送邮件服务器)地址
  • 原文地址:https://www.cnblogs.com/busicu/p/3859744.html
Copyright © 2011-2022 走看看