body{ margin:0; padding:0; font-size:30px}
div{ text-align:center; font-weight:bold}
.main,.footer{ width:960px; 【任务1】margin:0 auto}
.head{ width:100%; height:100px; background:#ccc;margin:0 auto}
.main{ height:600px; background:#FCC}
.footer{ height:50px; background:#9CF}
【任务1】莫名其妙
div{ text-align:center; font-weight:bold}
.main,.footer{ width:960px; 【任务1】margin:0 auto}
.head{ width:100%; height:100px; background:#ccc;margin:0 auto}
.main{ height:600px; background:#FCC}
.footer{ height:50px; background:#9CF}
【任务1】莫名其妙
body{ margin:0; padding:0; font-size:30px; font-weight:bold}
div{line-height:50px;}
.main{ width:960px; height:600px; margin:0 auto}
.left{ width:290px; height:590px; background:#ccc;float:left;}/
.right{ width:650px; height:590px; background:#FCC;float:right;position:relative;
right:10px;}
div{line-height:50px;}
.main{ width:960px; height:600px; margin:0 auto}
.left{ width:290px; height:590px; background:#ccc;float:left;}/
.right{ width:650px; height:590px; background:#FCC;float:right;position:relative;
right:10px;}
看不出来效果的 可以自己新建一个笔记本,代码复制到里面,然后保存HTML格式。 再点开就能看到效果。 不加margin:0 auto; 就是默认在左边 不是居中
.top{width:100%;height:100px;background:#ccc;}
.main{width:100%; height:500px;background:red;position:relative;}
.left{ width:200px;height:500px;background:blue;position:absolute;top:0;}
.right{height:500px;background:green;margin-left:210px;}
.foot{width:100%;height:50px;background:orange;}
.main{width:100%; height:500px;background:red;position:relative;}
.left{ width:200px;height:500px;background:blue;position:absolute;top:0;}
.right{height:500px;background:green;margin-left:210px;}
.foot{width:100%;height:50px;background:orange;}