<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>第3章自适应宽度及固定宽度的二列布局的实现</title> <style type="text/css"> body{ margin: 0;padding: 0} .main{ width: 800px;margin: 0 auto} .left{ width: 20%; height: 500px; float: left; background-color: #cccccc; } .right{ width: 80%; height: 500px; float: right; background-color: #dddddd; } </style> </head> <body> <div class="main"> <div class="left"></div> <div class="right"></div> </div> </body> </html>
