在手机客户端图片之间出现白线问题（仅自用记录）

鱼十四

于 2021-07-13 12:44:38 发布

阅读量973

点赞数

文章标签： html css

本文链接：https://blog.csdn.net/qq_42706559/article/details/118697398

版权

博客内容讲述了在页面布局中遇到手机客户端img图片显示时存在约0.8px白线的问题。作者尝试了将img标签设置为display:block，但效果不理想。最终通过修改img标签外的td父标签样式，将其设置为display:block并添加margin-top:-2px，成功消除间隙。然而这种方法可能导致相邻图片在切图时的位置错位，需要注意切图的准确性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

源码：

<tr>
	<td align="left" style="display:block;margin-top:-2px;" valign="top">
        <img alt="" border="0" src="" style="display: block;" width="">
    </td>
</tr>

说明：页面布局使用的是table布局，包裹img图片的父标签为td标签。

方法：将img标签外的父标签的属性设置为,style="display:block;margin-top:-2px;"

想法：网上查过一些资料，里面能够有用的就是将img的属性设置为dispaly:block;但是在手机的客户端依旧有差不多0.8px左右的白线。最后选择将外部的父标签td设置为块级标签，然后使用margin-top强行上移2px。网上的很多是建议是上移1px,个人认为最好以实际效果为准。

缺点：相邻图片在剪切时，不要切到整个圆类似的地方，最后整块来切。因为是强行上移2px,所以如果切图不注意，两张相邻图片或有错位。