HTML5中图⽚之间的缝隙完美解决⽅法
最近做h5的项⽬,碰到了⼀个百思不得其解的问题,⼏个img标签中间有⼤约3px的空隙
如图:
html中的5种空格表示
后来百度查了⼀番,⼤致了解了原因,是因为浏览器把元素当成了字,空隙是给⼀些对齐字母后仍然长出⼀截的(例如j,g)预留的。也
到了⼏种解决⽅法,亲测可⾏。
1,把body的font-size 设置成0;
这样做的时候要记得下⾯写div的时候给元素指定字号。
2,把
<img src="assets/img/turntable/lucky-turntable_07.jpg">
<img src="assets/img/turntable/lucky-turntable_11.png" >
<img src="assets/img/turntable/lucky-turntable_08.jpg">
写成
<img src="assets/img/turntable/lucky-turntable_07.jpg"><img src="assets/img/turntable/lucky-turntable_11.png"><img src="assets/img/turntable/lucky-turntable_08.jpg">也就是说,把img标签写在同⼀⾏,中间不要有空格;
以上所述是⼩编给⼤家介绍的HTML5中图⽚之间的缝隙完美解决⽅法,希望对⼤家有所帮助,如果⼤
家有任何疑问请给我留⾔,⼩编会及时回复⼤家的。在此也⾮常感谢⼤家对⽹站的⽀持!