html切图,如果是对一整张设计图进行分割的时候。如果不是以设计图的自然边界为基准进行切分的话,在生成html的时候,就可能在两张图之间出现一个非常明显的空行。而看代码的话,两个<img>标签之间却没有任何的换行代码出现。这个问题该如何解决呢?

苏南大叔:html相邻图片,如何解决两张图片间的空隙? - html-img-space
html相邻图片,如何解决两张图片间的空隙?(图3-1)

本文测试环境:chrome@74.0.3729.169。特约嘉宾是:海贼王路飞。

效果图

下图就是苏南大叔所描述的情况。而且,大家看html的话,也会发现:html里面并没有任何的换行代码。也没有任何的margin,padding之后的css属性。

<img src="001.png" style="width:100%" />
<img src="002.png" style="width:100%" />  

苏南大叔:html相邻图片,如何解决两张图片间的空隙? - html-img-space-01
html相邻图片,如何解决两张图片间的空隙?(图3-2)

总结

条条大路通罗马,这里苏南大叔给出了三个解决方案。至于哪个方案更好更合适,这个就是大家各自看各自的实际情况了。苏南大叔推荐您,了解更多html代码的相关文字:

如果本文对您有帮助,或者节约了您的时间,欢迎打赏瓶饮料,建立下友谊关系。
本博客不欢迎:各种镜像采集行为。请尊重原创文章内容,转载请保留链接作者。
本站采用创作共用版权协议, 要求署名、非商业用途和相同方式共享。
转载本站内容必须也遵循“署名-非商业用途-相同方式共享”的创作共用协议。
未经许可,规模化镜像抄袭本站内容的行为,将会根据有关法律法规进行维权。
程序如此灵动~》下所有原创文章,如被用于商业用途,请您按规定支付稿费。

 【加群】加入QQ群【175454274】和大家一起讨论这个问题

 【源码】本文代码片段及相关软件,请点此获取

 【绝密】秘籍文章入口,仅传授于有缘之人   css    html

本站的忠实读者小伙伴,正在阅读下面这些文章: