【css面试题】实现2栏布局右侧自适应； 3栏布局中间自适应

珊珊而川2023-09-18 7:06

2栏布局右侧自适应

flex

grid

table

float

html 复制代码

 <style >
    body{
        height: 400px;
    }
    .son1{
        width: 20%;
        height: 100%;
        float: left;
    }
    .son2{
        margin-left: 20%;
        height: 100%;
        
    }
   
  </style>
<body>        
    <div class="son1" style="background-color: #d2e085;"> A </div>
    <div class="son2" style="background-color: #7cdbe4;"> B </div>

</body>

absolute

3栏布局中间自适应

上一篇：css中BFC外边距塌陷解决办法

下一篇：css多个物体椭圆旋转

【css面试题】实现2栏布局 右侧自适应； 3栏布局 中间自适应

2栏布局 右侧自适应

flex

grid

table

float

absolute

3栏布局 中间自适应

【css面试题】实现2栏布局右侧自适应； 3栏布局中间自适应

2栏布局右侧自适应

3栏布局中间自适应