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需刷新才能执行]