html结构如下：
<div class="parents">
<div class="son"></div>
</div>
css结构如下：
.parents{
height: 200px;
width: 200px;
background-color: gray;
}
.son{
height: 100px;
width: 100px;
background-color: red;
margin-top: 50px;
}
效果如下：
父元素的位置会跟着子元素的margin-top值而变化
解决办法如下：
1.修改父元素的高度，增加padding-top样式模拟（padding-top：1px；常用）
2.为父元素添加overflow：hidden；样式即可（完美）
3.为父元素或者子元素声明浮动（float：left；可用）
4.为父元素添加border（border:1px solid transparent可用）
5.为父元素或者子元素声明绝对定位
