空隙是如何产生的? 财富值26

2016-11-06 11:51发布

<html> <head> <style type="text/css"> body {     width:400px;     font-size:30px; } #top {     width:400px;     line-height:30px;     background-color:#6CF;     padding-left:5px; } #box {     width:400px;     background-color:#FF6;     padding-left:5px;     position:static; } #box-1 {     width:350px;     background-color:#C9F;     margin-left:20px;     padding-left:5px; } #box-2 {     width:350px;     background-color:#C6F;     margin-left:20px;     padding-left:5px; } #box-3 {     width:350px;     background-color:#C3F;     margin-left:20px;     padding-left:5px; } #footer {     width:400px;     line-height:30px;     background-color:#6CF;     padding-left:20px; } </style> </head> <body> <div id="top">id=&quot;top&quot;</div> <div id="box">id=&quot;box&quot;   <div id="box-1">     <p>id=&quot;box-1&quot;</p>   </div>   <div id="box-2">     <p>id=&quot;box-2&quot;</p>    </div>   <div id="box-3">     <p>id=&quot;box-3&quot;</p>   </div> </div> <div id="footer">id=&quot;footer&quot;</div> </body> </html>  下面是显示效果 

读了半天css,也想不出,空隙是如何产生的?

2条回答
mishen - whatsns产品经理
1楼 · 2016-11-06 12:27.采纳回答

空隙是p标签的原生样式产生的,可以直接一开始就把p标签的margin和padding设置为0,这样就不会有空隙了,需要margin或者padding再加上,这样样式也好控制些

margin和padding,你可以设置margin-top:0,padding 也有类似的属性http://www.w3school.com.cn/cs...

一周热门 更多>