qq_42263768的博客

原创 关于margin塌陷问题

代码中类名为box1的块元素所使用margin-top属性，并没有直接将父元素撑开（见图1中，box_father块元素的背景色，发现其确实没有被撑开），而是将此属性赋予给了父元素（这也是一种表象，形似有这种效果，实际上在浏览器中的开发者工具中可以看到父元素并没有这个margin属性，浏览器清晰地知道margin属性是属于box1的，详见图2）。总结：父元素的第一个或最后一个元素的margin-top属性和margin-bottom属性会导致出现margin塌陷问题，会致使父元素的height比预期中小。