div+css排版的样例

div+css排版的样例










Div布局

body{text-align:center;margin:0;padding:0}
/*text-align:center是ie中必须要有的*/
div
{
height:200px;
color:red;
}
.title
{
margin:0 auto;
width:776px;
background-color:#abcdef;
}
.middle
{
margin:0 auto;
width:776px;
}
.left
{
float:left;
clear:right;
width:20%;
background-color:#eeefff;
}
.center
{
float:left;
clear:right;
width:50%;
background-color:#CCC000;
}
.right
{

float:left;
clear:right;
width:30%;
background-color:#fff000;
}
.both
{
clear:both;
width:100%;
background-color:#666999;
}
.footer
{
margin:0 auto;
width:776px;
clear:both;
background-color:#000fff;
}



顶部

左侧
中部
右侧
全行
左侧
中部
右侧
全行
左侧
中侧
右侧

底部

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]