方法2:*{margin:0; padding:0;}
#wrap{width:970px; margin:0 auto;}
#mainbody{ position:relative; margin-top:15px;}
#left{ border:1px solid #999;float:left;width:110px; }
#mid{ float:left;width:650px;border:1px solid #999; margin-left:13.5px;}
#right{border:1px solid #999;position:absolute;left:791px; }
#wrap{width:970px; margin:0 auto;}
#mainbody{ position:relative; margin-top:15px;}
#left{ border:1px solid #999;float:left;width:110px; }
#mid{ float:left;width:650px;border:1px solid #999; margin-left:13.5px;}
#right{border:1px solid #999;position:absolute;left:791px; }
2016-09-26
#wrap{width:970px; margin:0 auto;}
#mainbody{ margin-top:15px;}
#left{ border:1px solid #999;float:left;width:110px; }
#mid{ float:left;width:650px;border:1px solid #999; margin-left:13.5px;}
#right{border:1px solid #999;width:177px; float:right; }
#mainbody{ margin-top:15px;}
#left{ border:1px solid #999;float:left;width:110px; }
#mid{ float:left;width:650px;border:1px solid #999; margin-left:13.5px;}
#right{border:1px solid #999;width:177px; float:right; }
2016-09-26
这个里面,最后用的是margin-left:200px,用left:200px,有何影响
---------------------------------------------------------------
同意层主,既然用绝对定位的偏移来设置,那么就应该全用偏移 top:0;left:200px;没有必要再用margin
---------------------------------------------------------------
同意层主,既然用绝对定位的偏移来设置,那么就应该全用偏移 top:0;left:200px;没有必要再用margin
2016-09-26
#mainbody {
background:#FC0;
任务一: width:100%;
overflow:hidden;
}
.left {
width:800px;
height:200px;
background:#000;
任务二:
float:left;
}
.right {
width:140px;
height:500px;
background:#690;
任务三:
float:right;
background:#FC0;
任务一: width:100%;
overflow:hidden;
}
.left {
width:800px;
height:200px;
background:#000;
任务二:
float:left;
}
.right {
width:140px;
height:500px;
background:#690;
任务三:
float:right;
个人建议把left和right块不要设置背景颜色,改设置边框,可以很直观的看到,一开始left和right块在mainbody块中顺序排列,设置left块左浮动后,left块“漂浮”起来,遮住了right块,在right块也设置左浮动后,同样“漂浮”起来,紧跟left块后面显示在同一行,这俩都“漂浮”后,其父块mainbody里就没有东西了,所以不显示,右面缩起来的版权部分其实没变化,还是100%的宽度,不过上移变为紧跟header后显示了,不过被俩漂浮的块遮住了940px,所以只显示右边那一点儿。插一句,overflow:hidden的清除浮动原理还是没太搞明白……/(ㄒoㄒ)/~~
2016-09-25
#mainbody {
width:100%;
position:relative;
margin-top:20px;
}
#content {
position:absolute;
top:0;
margin-left:200px;
}
觉得自己思考的方向还是没错。看了半天都不知道错误在哪。居然少写了-left。大老粗,还是得细心点!
width:100%;
position:relative;
margin-top:20px;
}
#content {
position:absolute;
top:0;
margin-left:200px;
}
觉得自己思考的方向还是没错。看了半天都不知道错误在哪。居然少写了-left。大老粗,还是得细心点!