子级对父级的绑架

子级对父级的绑架这里主要是针对css布局时来说的。想要摆脱或者说让父级不受子级布局的影响这里我们来说三种解决方法(注：div1为父级)。

方法一：

子级里使用margin的属性，但是在父级里面必须添加bord的属性如：

.div1{
    width: 200px;
    height: 180px;
    background-color: #0099ff;
    border: 1px solid transparent;
}
.div2{
    width: 40px;
    height: 40px;
    background-color: red;
    margin-top: 40px;
}

方法二：父级使用pandding的属性，但是父级的宽高属性应相应的减去pandding里使用的具体数字如：

.div1{     width: 200px;     height: 180px;     background-color: #0099ff;     padding-top: 20px;

} .div2{     width: 40px;     height: 40px;     background-color: red;     margin-top: 40px; }

方法三：在子附近之间加上空格的nspb；但是要用具体的样式把nspb的相应属性设为0。如：

《div class="div1">
<div style="height: 0;">&nbsp;</div>
<div class="div2"></div>

理解就这三个，我终于明白了为什么自己写网页时有时布局会莫名其妙的就乱了，特别是在使用了position的相应属性后。知道这个知识点后，希望自己在以后的应用中能更加的熟练，效率更高。