1.margin塌陷，通俗叫法。
假如一个盒子box里边嵌套了两个盒子（记为box1,box2)。box1的margin-top不会如预想的一样在box顶部撑开一个边距，而是以包含box的容器上边界为基准撑开边距。
解决方法：一、设置box1 padding-top.
二、设置box display:absolute.
三、设置box overflow：hidden。
立即学习“前端免费学习笔记（深入）”；
2.如图示：
此类问题代码为：box{width:500px ; height:50px;line-height:50px; text-align:center; border:1px solid #333;}
box span{display:inline-block; width:100px; height: 20px;}
出现此问题有如下几点：父级元素设置text-align:center;使得盒子内文字居中，此时若不设置 span 为inline-block; ,span会自动撑开；
若span设置为inline-block; ,其宽 度和高度的设置不影响文字位置。
解决方法为：一、父元素设置padding-top。
二、父元素仍设置居中，span 不设置内联块盒子，而设置其内边距，撑开所需要的宽度。
效果如下：
。
HTML怎么学习？HTML怎么入门？HTML在哪学？HTML怎么学才快？不用担心，这里为大家提供了HTML速学教程(入门课程)，有需要的小伙伴保存下载就能学习啦！
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
793
收藏
