zoukankan      html  css  js  c++  java
  • 后台布局之反例

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style>
            .pg-header{
                height: 48px;
                background-color: #1d9ad6;
                color: white;
            }
            .pg-content{}
            .pg-footer{}
            .pg-content .menu{
                20%;
                background-color: red;
                min- 200px;
                height: 700px;
            }
            .pg-content .content{
                80%;
                background-color: green;
                min- 200px;
    
            }
            .left{
                float:left;
            }
            .right{
                float: right;
            }
        </style>
    </head>
    <body style="margin: 0">
            <div class="pg-header"></div>
            <div class="pg-content">
                <div class="menu left">asd</div>
                <div class="content left">
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                    <p>asdasd</p><p>asdasd</p><p>asdasd</p><p>asdasd</p>
                </div>
            </div>
            <div class="pg-footer"></div>
    </body>
    </html>
    

      

  • 相关阅读:
    Linux Shell入门
    Linux系统结构
    Ubuntu bond 配置
    VXLAN概述
    lsof
    入驻博客园,希望可以跟大家一起讨论,一起学习和进步。
    版本管理工具小乌龟TortoiseGit的安装和使用(2)
    版本管理工具小乌龟TortoiseGit的安装和使用(1)
    定义变量时未初始化赋值的问题
    BlackBerry 9900刷机
  • 原文地址:https://www.cnblogs.com/qiangayz/p/8725778.html
Copyright © 2011-2022 走看看