css怎么左右排版?

在body里放两个div,左右并排,左边div有固定宽度,右边通过左边挤开占满右侧空间。奈何我css一般,之前都是拿js写的。

可以用css的特性flex来完成:
外层设置display:flex,比如左侧div定义宽度200px,右侧div设置flex:1自动计算宽度


<!DOCTYPE html>
<html>
    <head>
        <title>页面标题(w3cschool.cn)</title>
        <style>
            .main{width:100%;display:flex;}
            .left{width: 100px;height:100px;background:#f00;flex-shirk:0;}
            .right{flex:1;height:100px;background:blue;}
        </style>
    </head>
    <body>
        <div class="main">
            <div class="left">
                这是左
            </div>
            <div class="right">
                这是右
            </div>
        </div>
    </body>
</html>

img

开启弹性布局

这个是总结的一些方法,有用望采纳
https://blog.csdn.net/weixin_50930483/article/details/124878467?spm=1001.2014.3001.5502