zoukankan      html  css  js  c++  java
  • 两栏布局:左侧固定右侧自适应

    1.position: absolute方法

      .left{
                position: absolute;
                background-color:green;
                 200px;
                top: 0;
                left: 0;
                min-height: 500px;
            }
            .right{
                background-color:red;
                margin-left: 200px;
                min-height: 500px;
                left: 0;
                top: 0;
            }
    2.float: left方法
      .left{
                float: left;
                 300px;
                background-color:black;
            }
            .right{
                overflow: hidden;
                background-color:blue;
            }
    3.display: flex方法
      .content{
                display: flex;
            }
            .aside.left{
                border:1px solid black;
                 300px;
            }
            .aside{
                height: 500px;
            }
            .aside.right{
                flex-grow: 1;
                border: 1px solid red;
            }
      <div class="content">
              <div class="aside left">left</div>
              <div class="aside right">right</div>
        </div>
    ————学习记录
  • 相关阅读:
    MIPI CSI2学习(一):说一说MIPI CSI2
    图解数据结构树之AVL树
    查找树ADT--二叉查找树
    hisi mmz模块驱动讲解
    抓包工具 tcpdump 用法说明
    4. 海思Hi3519A MPP从入门到精通(四 视频输出)
    PHP无限分类分类导航LINK的代码实现
    PHP 无限极分类下拉列表实现
    PHP无限极分类原理
    微信支付回调验证签名处理
  • 原文地址:https://www.cnblogs.com/atao24/p/13305841.html
Copyright © 2011-2022 走看看