左栏固定，右栏自适应的两栏布局
第一种方法：采用绝对定位+BFC（overflow:auto） <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> *{ margin: 0; padding: 0; } .left{ width: 200px; height: 200px; background: red; position: absolute; } .right{ height: 200px; margin-left: 200px; background: blue; overflow: auto; } </style> </head> <body> <div class="left">左边</div> <div class="right">右边</div> </body> </html> 第二种方法：采用左浮动+BFC （overflow:auto） <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> *{ margin: 0; padding: 0; } .left{ width: 200px; height: 200px;