两个普通的div在都设置了margin之后，它们之间的距离不会叠加。只会是两者中边距最大那个数值，如下：
<style>
#father{width:300px;
height:300px;
margin-right:50px;
background:#3F6;
}
#child1{
height:100px;
margin-bottom:50px;
background-color:#666;
}
#child2{
height:100px;
margin-top:50px;
background-color:#F3C;
}
</style>
</head>
<body>
<div id="father">
<div id="child1"></div>
<div id="child2"></div>
</div>
</body>
</html>
效果代码图：
但是如果这两个div是浮动的那么他们的margin就会是相加的。
这里说说div里的宽和高，当把某个div设置了宽和高度之后，这个宽和高度指的的其内容不包括border, padding,margin的。但是当设置了div的背景之后这个背景的区域是包括padding的部分。
<div style="width:300px;height:300px;margin-top:50px; border:20px solid #000; padding:20px; background-color:#0F0">
是这个div
</div>
这个div的效果图如下：div的世界高度是设置的高度加上border加上Padding的值之后的。
490
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
