1. border-collapse
- 该CSS属性用来设定表格的行和列的边框是合并成单边框,还是分别有各自的边框
- separate 缺省值。边框分开,不合并。
- collapse 边框合并。即如果相邻,则共用同一个边框。
2. margin collapse
- margin collapse,即边界塌陷或者说边界重叠。对于上下两个并列的div块而言,上面div的margin-bottom和下面div的margin-top会塌陷,也就是会取上下两者margin里最大值作为显示值,所以从这个意义上说:CSS及浏览器的设计者们希望我们在布局时,如果遇到上下两个并排内容块的安排,最好只设置其中每个块上或下margin的一处即可。
- 对于父块DIV内含子块DIV的情况,对于有块级子元素的元素计算高度的方式,如果元素没有垂直边框和填充,那其高度就是其子元素顶部和底部边框边缘之间的距离。
eg:
#fatherDiv{ background:#808000; width:300px; height:300px; margin:100px 0 0 100px; } #childDiv{ background:#c0c0c0; width:150px; height:150px; margin-left:20px; margin-top:30px; //此处虽然设定了margin-top但是子div还是和父div的顶部重合 }
3.解决方法
1、给父DIV设置边框,当然可以设置边框为透明;
border:1px solid transparent或 border-top:1px solid transparent