兩個DIV，左側的div寬度固定，右側DIV自適應填滿剩下的寬度。
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>demo</title> <style type="text/css"> #wrap{ padding-left: 200px; } .leftpart{ float:left; width:200px; margin-left:-200px; height: 200px; background-color:lightgreen; } .rightpart{ float: right; width: 100%; height: 200px; background-color: lightseagreen; } </style> </head> <body> <div id="wrap"> <div class="rightpart">寬度自適應部分</div> <div class="leftpart">width200的左邊欄</div> </div> </body> </html>
效果如圖
轉自 https://blog.csdn.net/weixin_41804384/article/details/81000291