<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>div + css宽度自适应(液态布局)</title> <style type="text/css"> /*左边栏,设定宽度*/ .wrap_l { float: left; width: 150px; border: 1px solid #333; } /*中间栏,宽度auto*/ .wrap_m { width: auto; margin: 0 140px 0 150px; border: 1px solid #000; } /*右边栏,固定宽度*/ .wrap_r { float: right; width: 140px; border: 1px solid #999; } </style> </head> <body> <div id="wrap"> <div class="wrap_l"> 这是左边部分<br /> 这是左边部分<br /> 这是左边部分 </div> <div class="wrap_r"> 这是右边部分<br /> 这是右边部分<br /> 这是右边部分 </div> <div class="wrap_m"> 这是中间部分 </div> </div> </body> </html>