塌陷问题

塌陷:

• 两个嵌套的元素,如果给子元素margin-top属性,则这个属性会错误的同时传递给其父元素,使得两个元素同时拥有margin-top属性.

p{
	margin-top:20px;
}

div{
	p{}
}

解决办法:

1. overflow: hidden; 这个属性可以隐藏超出部分的内容,用在这里可以纠正塌陷问题,使得父元素div不受到子元素margin属性的影响.
2. border,padding利用给父元素添加上边框或者上内边距的方法来解决此问题,需要设置边框或边距为1px,且颜色与父元素div的背景颜色相同,从而达到视觉上的纠正.