>  기사  >  웹 프론트엔드  >  两个div之间为什么总有间隙?_html/css_WEB-ITnose

两个div之间为什么总有间隙?_html/css_WEB-ITnose

WBOY
WBOY원래의
2016-06-21 09:44:332206검색

CSS HTML 布局 DIV


今天在做div+css布局网页。遇到了间隙的问题。刚接触,求指点...
下面为html代码:
<div id="container1"><!--页面层容器页面层容器 -->    <div id="top1">最上面绿色部分<!--页面头部-->    </div>   <div id="banner1">上面灰色部分<!--页面头部-->    </div>      <div id="pagebody1"><!--页面主体页面主体-->            <div id="left1">左侧栏<!--侧边栏-->        </div>                    <div id="right1">右侧栏<!--主体内容-->        </div>     </div>       <div id="footer1">页面底部<!--页面底部-->   </div></div>

下面为CSS代码:
/*页面层容器1*/#container1 {width:800px;margin:0px auto;background:#369;}/*页面头部1*/#top1 {background:#090;width:730px;margin:0 auto;}#banner1 {background:#999; /*设置背景颜色为灰色*/ width:730px; /*设定层的宽度*/ margin:0 auto; /*层居中*/  /*设定高度*/  /*border-bottom:5px solid #F06;画一条红色实线*/  clear:both; /*清除浮动*/}#pagebody1 { width:730px; /*设定宽度*/margin:0 auto; /*居中*/background:#F00;/*设置主体背景颜色为大红色*/clear:both; /*清除浮动*/}#left1 { float:left; /*浮动居左*/clear:left; /*不允许左侧存在浮动*/width:500px; /*设定宽度*/height:240px; text-align:left; /*文字左对齐*/overflow:hidden; /*超出宽度部分隐藏*/background:#CCC;/*设置背景颜色为灰白色*/}#right1 { float:right;/*浮动居右*/clear:right; /*不允许右侧存在浮动*/width:230px; /*设定宽度*/ height:240px;text-align:left; /*文字左对齐*/ overflow:hidden; /*超出宽度部分隐藏*/background:#9CC;/*设置背景颜色为浅蓝色*/}#footer1 {background:#06F;height:35px;clear:both;margin:0 auto;}/*自己设定的div部分结束*/


所有padding,margin什么都改了,还是对不齐。。。麻烦看下错到哪里了?

回复讨论(解决方案)

刚刚在DW中又看了一下,发现是一个空格占了位子,所以导致两个div一直不能无间隙贴合。

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.