<style>
div {font-size: 12px;}
#header { MARGIN: 0px; BORDER: 0px; BACKGROUND: #ccd2de; WIDTH: 580px; HEIGHT: 60px;}
#mainbox { MARGIN: 0px; WIDTH: 580px; BACKGROUND: #FFF; }
#sidebar { FLOAT: left; MARGIN: 2px 2px 0px 0px; PADDING: 0px; BACKGROUND: #F2F3F7; WIDTH: 170px; }
#menu { FLOAT: right; MARGIN: 2px 0px 2px 0px; PADDING:0px 0px 0px 0px; WIDTH: 400px; BACKGROUND: #ccd2de; }
#content { FLOAT: right; MARGIN: 1px 0px 2px 0px; PADDING:0px; WIDTH: 400px; BACKGROUND: #E0EFDE;}
#footer { CLEAR: both; MARGIN: 0px 0px 0px 0px; PADDING: 5px 0px 5px 0px; BACKGROUND: #ccd2de; HEIGHT: 40px; WIDTH: 580px; }
</style>
<div id="header">这里是#header</div>
<div id="mainbox">这里是#mainbox
<div id="menu">这里是#sidebar,背景颜色用的是#main的背景色</div>
<div id="sidebar">这里是#menu<br /><strong>注意:这里如何自适应左边的高度?</strong></div>
<div id="content">这里是#content<br /><br />这里是主要内容,根据内容自动适应高度<br /><br />这里是主要内容,根据内容自动适应高度<br /><br />这里是主要内容,根据内容自动适应高度</div>
</div>
<div id="footer">这里是#footer</div>
div {font-size: 12px;}
#header { MARGIN: 0px; BORDER: 0px; BACKGROUND: #ccd2de; WIDTH: 580px; HEIGHT: 60px;}
#mainbox { MARGIN: 0px; WIDTH: 580px; BACKGROUND: #FFF; }
#sidebar { FLOAT: left; MARGIN: 2px 2px 0px 0px; PADDING: 0px; BACKGROUND: #F2F3F7; WIDTH: 170px; }
#menu { FLOAT: right; MARGIN: 2px 0px 2px 0px; PADDING:0px 0px 0px 0px; WIDTH: 400px; BACKGROUND: #ccd2de; }
#content { FLOAT: right; MARGIN: 1px 0px 2px 0px; PADDING:0px; WIDTH: 400px; BACKGROUND: #E0EFDE;}
#footer { CLEAR: both; MARGIN: 0px 0px 0px 0px; PADDING: 5px 0px 5px 0px; BACKGROUND: #ccd2de; HEIGHT: 40px; WIDTH: 580px; }
</style>
<div id="header">这里是#header</div>
<div id="mainbox">这里是#mainbox
<div id="menu">这里是#sidebar,背景颜色用的是#main的背景色</div>
<div id="sidebar">这里是#menu<br /><strong>注意:这里如何自适应左边的高度?</strong></div>
<div id="content">这里是#content<br /><br />这里是主要内容,根据内容自动适应高度<br /><br />这里是主要内容,根据内容自动适应高度<br /><br />这里是主要内容,根据内容自动适应高度</div>
</div>
<div id="footer">这里是#footer</div>