<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="top"</div> <div id="box">id="box" <div id="box-1"> <p>id="box-1"</p> </div> <div id="box-2"> <p>id="box-2"</p> </div> <div id="box-3"> <p>id="box-3"</p> </div> </div> <div id="footer">id="footer"</div> </body> </html> 下面是显示效果
读了半天css,也想不出,空隙是如何产生的?
margin和padding,你可以设置margin-top:0,padding 也有类似的属性http://www.w3school.com.cn/cs...
一周热门 更多>