zoukankan      html  css  js  c++  java
  • 网页布局//上左不动,其他滑动

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    <style>
        /*上左不动,其他的可以滑动*/
        *{
            margin: 0px;
            padding:0px;
        }
        #one{
            background:#1DC9D8;
            z-index:1;
            100%;
            height: 100px;
            position: fixed;
            margin-top: -100px;
        }
        #content{
            margin-top: 100px;
            position:relative;
            100%;
            height:2000px;
        }
        #right{
            background:yellow;
            20%;
            height:400px;
            position: fixed;
            z-index: 1;
            
        }
        
        #left{
            background:pink;
            80%;
            float:right;
            height:1800px;
        
        }
        #foot{
            background:#37E519;
            100%;
            height:150px;
            position:relative;
        }
    </style>
    <body>
        <div>
            <div id="one">首页</div>
            <div id="content">
                <div id="right">列表</div>
                <div id="left">内容</div>
            </div>
            <div id="foot">底部</div>
        </div>
    </body>
    </html>

  • 相关阅读:
    第二次结对编程作业
    团队项目-需求分析报告
    团队项目-选题报告
    第一次结对编程作业
    第一次个人编程作业
    第一次博客作业
    第04组 团队Git现场编程实战
    第二次结对编程作业
    团队项目-需求分析报告
    团队项目-选题报告
  • 原文地址:https://www.cnblogs.com/zouyun/p/7127258.html
Copyright © 2011-2022 走看看