div+CSS完成网页布局(上下左右)_html/css_WEB-ITnose
程序员文章站
2022-03-16 18:36:34
...
无标题文档 title >
body {
margin : 0 ;
padding : 0 ;
}
#head {
height : 40px ;
background-color : #0033CC ;
width : 800px ;
margin : 0 ;
}
#content {
width : 800px ;
background : #CCCCCC ;
height : 200px ;
margin : 0 ;
}
#left {
top : 40px ;
width : 150px ;
height : 200px ;
background : #CCCC66 ;
float : left ;
margin : 0 ;
}
#c {
width : 500px ;
height : 200px ;
background : #FFFFFF ;
margin : 0 ;
}
#right {
width : 150px ;
height : 200px ;
background : #339966 ;
float : right ;
margin : 0 ;
}
#foot {
width : 800px ;
background : #0099CC ;
height : 40px ;
margin : 0 ;
}
style >
head >
head div >
left div >
content div >
rigth div >
div >
foot div >
body >
html >
推荐阅读
-
css3 +html5+js 手机网页布局问题(在微信上使用).两个问题_html/css_WEB-ITnose
-
div+css布局实例淘宝分析(三)(2)_html/css_WEB-ITnose
-
DIV+CSS布局的几点建议_html/css_WEB-ITnose
-
div+css页面布局_html/css_WEB-ITnose
-
div+css:一行布局三(多)个版块_html/css_WEB-ITnose
-
精通CSS+DIV网页样式与布局CSS文字效果_html/css_WEB-ITnose
-
HTML、CSS中的网页页面布局问题_html/css_WEB-ITnose
-
50个photoshop网页设计教程-整体布局篇_html/css_WEB-ITnose
-
div+css 布局浏览器兼容_html/css_WEB-ITnose
-
学习DIV+CSS布局的一些感悟(II)_html/css_WEB-ITnose