zoukankan      html  css  js  c++  java
  • 纯CSS实现侧边栏/分栏高度自动相等

    <!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Document</title>
        <style>
            #content {
                overflow: hidden;
            }
            
            .left {
                width: 200px;
                /* 在小于3000的范围内都使用 */
                margin-bottom: -3000px;
                padding-bottom: 3000px;
                background: blue;
                float: left;
            }
            
            .right {
                width: 400px;
                margin-bottom: -3000px;
                padding-bottom: 3000px;
                background: red;
                float: right;
            }
            
            .center {
                margin: 0 410px 0 210px;
                background: green;
                height: 2000px;
            }
        </style>
    </head>
    
    <body>
        <div id="content">
            <div class="left">左边,无高度属性,自适应于最高一栏的高度</div>
            <div class="right">右边,无高度属性,自适应于最高一栏的高度</div>
            <div class="center">中间,高度600像素,左右两栏的高度与之自适应</div>
        </div>
    </body>
    
    </html>
  • 相关阅读:
    1767:字符合并
    成绩单
    floj 2264
    floj 2265 【lxs Contest #141】航海舰队
    CF932D Tree
    1745:分组
    1744:跳台阶
    Xamarin.Forms之跨平台性能
    Xamarin.Forms之部署和测试(性能)
    Xamarin.Forms数据绑定
  • 原文地址:https://www.cnblogs.com/moxiaowohuwei/p/7506522.html
Copyright © 2011-2022 走看看