两列布局_html/css_WEB-ITnose

一、常见的两列布局

如百度搜索结果页面，两列固定宽度，高度自适应。

博客园文章内容页面和上边的结构类似。

二、实现两列布局步骤

1）应用浮动

CSS如下

*{margin:0;padding:0;}#header,#footer{width:960px; height:40px; background-color:#f0f0f0; margin:0 auto;}#drapper{ width:960px;  margin:10px auto;} .mainBox{float:left; width:680px;  background-color:red;}.sidebar{float:right; width:270px;background-color:red;} 

　　我们的html结构一般是这样的

header

      
查看更多关于两列布局_html/css_WEB-ITnose的详细内容...
        

          
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://haodehen.cn/did106173