<pre name="code" class="html"><style type="text/css" media="screen">
*{margin: 0;padding: 0;}
.pare{width: 600px;height: 600px;background-color: #ccc;}
.child{width: 300px;height: 300px;background-color: red;margin: 50px;}
</style>
</head>
<body>
<div class="pare">
<div class="child"></div>
</div>
</body>
在设置子DIV的margin-top时候,如果与父DIV之间无任何元素的间隔(父div没有上补白(padding-top)和上边框(border-top)),那么就会让父DIV的位置受到影响。如图:
解决办法:
1.父DIV中添加:overflow:hidden;
2.在子DIV块中用padding-top代替margin-top
3.为父DIV设置上边框。(透明的边框border-top:1px solid transparent;)