div+css 常用三種自動適應寬度分欄

CSS兩列布局，右側固定，左側自適應寬度

< div  style = "width:90%; margin:0 auto; overflow:auto; _display:inline-block;" >

     < div  style = "width:200px; float:right; background:#090" >這是右側的內容</ div >

     < div  style = " margin-right:210px; background:#F33" >這是左側的內容，自適應寬度</ div >

</ div >

 

 

CSS兩列布局，左側固定，右側自適應寬度

< div  style = "width:90%; margin:0 auto; overflow:auto; _display:inline-block;" >

     < div  style = "width:150px; float:left; background:#6F0" >這是左側的內容 固定寬度</ div >

     < div  style = " margin-left:160px; background:#FC0" >中間內容，自適應寬度</ div >

</ div >

 

CSS三列布局，左右寬度固定，中間自適應寬度

< div  style = "width:90%; margin:0 auto; overflow:auto; _display:inline-block;" >

     < div  style = "width:200px; float:right; background:#393" > 這是右側的內容 固定寬度</ div >

     < div  style = "width:150px; float:left; background:#F60 " >這是左側的內容 固定寬度</ div >

     < div  style = " margin-left:160px;margin-right:210px; background:#6C3;" >中間內容，自適應寬度</ div >

</ div >

 overflow:auto; _display:inline-block; 是清除浮動的，_display:inline-block;針對IE6的。