Div+Css(3)_html/css_WEB-ITnose

今天看了div+css的第三集视频教程。
感觉不是很好，发现本集视频只是做了一个网页框架。这并没有什么感觉不好的，让人觉得有点不好的是：讲师只是单独的使用的ie来测试讲解。
我个人把demo分别放大ietester测试，放到ff4,放到opera，放到chrome发现只有在ie核心下效果才不会变形。失望。。。
兼容性差了。。。有空把该框架改进一下！呵呵。。。
也不怎么多说了。

效果图：

代码如下：

立即学习“前端免费学习笔记（深入）”；

 #container {
  width:800px;
  height:1000px;
  margin:auto 0px;
 }

 #header {
          float:left;
           width:800px;
           height: 100px;
         margin:auto 0px;
            background:red;
          clear:both;
       
 }

 #logo {
  float:left;
  width:250px;
  height:90px;
  background:green;
  clear:right;
   margin:opx;
 }

 #banner{
  float:right;
  width:540px;
  height:90px;
  margin:0px;
  clear:left;
  background:blue;
 }
 
 #menu {
    width:800px;
     height:35px;
     margin:auto 0px;
   clear: both;
 
 }
 
 
 .nav {
 margin:auto 0px;
  width:800px;
  height:10px;
   clear:both;
   background:#ffffff;
    line-height:10px;
 }

 .nav_a {
 float:left;
 margin:0px;
  width:610px;
   height:10px;
   clear:both;
   background:#ffffff;
    line-height:10px;
 }
 
 .left_main {
   margin:0px;
   float:left;
   width:610px;
   height:420px;
   background:red;

 }

 .right_main{
  margin:0px;
  float:right;
  width:180px;
  height:420px;
  background:green;
  clear:left;
 }

 .left_a {
  margin:0px;
  float:left;
  width:300px;
  height:205px;
  background:blue;

 }

 .left_b {
  margin:0px;
  float:right;
  width:300px;
  height:205px;
  background:blue;
  clear:left;
 }
 
 .con {
  margin:auto 0px;
   width:800px;
   height:200px;
  background:green;
  clear:both; 
 
 }
 
 .one {
  float:left;
  width:200px;
  height:200px;
  background:#ff99f0;
  clear:right;
 }

  .two{
  float:left;
  width:200px;
  height:200px;
  background:#ffcc00;
 }

  .three {
  float:left;
  width:200px;
  height:200px;
  background:#0ffff0;
 }

 .four {
  float:right;
  width:190px;
  height:200px;
  background:#f0fff0;
 }

 #footer {
  width:800px;
  height:100px;
  background:red;
  margin:auto 0px;
  padding-top: 30px;
  color: #ffffff;
 }
//-->