本文分析了小程序中Image组件与View组件之间出现不必要间隙的问题，探讨了间隙可能由inline元素的baseline对齐引起。通过将Image的display属性改为block或调整vertical-align属性，可以成功消除这个间隙。
如图所示： image跟view标签上下产生了不该存在间隙。
DOM结构如下：
首先看看是不是margin在作祟：
审查元素image标签：
view标签：
事实证明跟margin无关；
但是我们发现，image的display是 inline-block；
而inline元素默认是跟父级元素的baseline对齐，而baseline又和父级底边有一点间距，这个间隙是不是这样产生的呢？
我们将image的display改成 block：
间隙消失：
按照这个思路，我们更改image标签的vertical-align，也可以解决这个间隙问题：
扫一扫
1435
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
