本文探讨了在Firefox与IE浏览器中，特定HTML结构导致的不同布局表现问题。通过对比分析，深入研究了如何通过简单的代码调整来实现跨浏览器的一致布局效果。
<body style="margin:0;height:0;">
<div id="a0" style="background-color:#333333;height:500px;">
<br style="line-height:0;"/>
//问题存在于--不加入br这一行，在FireFox中a1的margin-top:20px将会在a0上作用，使a0上方与body间有20px的间距,a1与a0的上方没有间距，而IE内正常显示
<div id="a1" style="background-color:#000000;margin-top:20px;height:100px;"></div>
<div id="a2" style="background-color:#000000;margin-top:20px;height:100px;"></div>
</div>
</body>
<div id="a0" style="background-color:#333333;height:500px;">
<br style="line-height:0;"/>
//问题存在于--不加入br这一行，在FireFox中a1的margin-top:20px将会在a0上作用，使a0上方与body间有20px的间距,a1与a0的上方没有间距，而IE内正常显示
<div id="a1" style="background-color:#000000;margin-top:20px;height:100px;"></div>
<div id="a2" style="background-color:#000000;margin-top:20px;height:100px;"></div>
</div>
</body>
扫一扫
2410
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
