html中关于margin的问题
想要的效果是蓝色的色块紧贴网页顶部，黄色的在蓝色里面距离蓝色色块顶部10px。但定位黄色色块后蓝色的位置也变了，是怎么回事呢，代码是这样的：<html><head><ti...
想要的效果是蓝色的色块紧贴网页顶部，黄色的在蓝色里面距离蓝色色块顶部10px。但定位黄色色块后蓝色的位置也变了，是怎么回事呢，代码是这样的：
<html>
<head>
<title>22</title>
<style type="text/css">
* { margin:0; padding:0;}
#a { width:300px; height:200px; margin:0 auto; background:#0ff; }
#b { width:100px; background:#ff0; height:80px; margin:10px auto 0;}
</style>
</head>
<body>
<div id="a"><div id="b"></div></div>
</body>
</html> 展开
<html>
<head>
<title>22</title>
<style type="text/css">
* { margin:0; padding:0;}
#a { width:300px; height:200px; margin:0 auto; background:#0ff; }
#b { width:100px; background:#ff0; height:80px; margin:10px auto 0;}
</style>
</head>
<body>
<div id="a"><div id="b"></div></div>
</body>
</html> 展开
展开全部
改为：
#a { width:300px; height:200px; margin:0 auto; background:#0ff; padding-top:10px}
#b { width:100px; background:#ff0; height:80px; margin:0 auto;}
垂直Margin会自动合并，自动取两者最大值。除非中间有padding或border值。
详细可查看：http://www.w3school.com.cn/css/css_margin_collapsing.asp
#a { width:300px; height:200px; margin:0 auto; background:#0ff; padding-top:10px}
#b { width:100px; background:#ff0; height:80px; margin:0 auto;}
垂直Margin会自动合并，自动取两者最大值。除非中间有padding或border值。
详细可查看：http://www.w3school.com.cn/css/css_margin_collapsing.asp
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
设置一下b的div层margin-top:10px;
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
