两栏布局三栏布局

况几

已于 2022-10-07 14:36:16 修改

阅读量134

点赞数

分类专栏： web前端文章标签： css css3 html

于 2022-10-07 14:35:34 首次发布

本文链接：https://blog.csdn.net/angrynouse/article/details/127190238

版权

float

<style>
       .left{
   
            width: 200px;
            height: 200px;
            float: left;
            background-color: blue;
        }
       .right{
   
            margin-left: 200px;
            height: 200px;
            background-color: pink;
        }
</style>

<div class="father">
    <div class="left"></div>
    <div class="right"></div>
</div>

绝对定位

<style>
        .father {
   
             position: relative;
             height: 200px;
         }
            
         .left {
   
             position:absolute;
             width: 200px;
             height: 100%;
             left: 0;
             background-color: blue;
          }

         .right {
   
             position:absolute;
             height: 100%;
             left:200px;
             right: 0;
             background-color