本文摘自PHP中文网,作者藏色散人,侵删。
css中取消图片间隔的方法:首先创建一个HTML示例文件;然后通过img标签插入两个图像;接着在img标签的父级上写“font-size:0;”;最后设置属性“display:block”即可。

本教程操作环境:windows7系统、css3版,该方法适用于所有品牌电脑。
推荐:《css视频教程》
取消img图片间隙的方法
1、多个img标签写在一行
1 2 | <img src= "/i/eg_tulip.jpg" alt= "郁金香" height= "100px" />
<img src= "/i/eg_tulip.jpg" alt= "郁金香" height= "100px" />
|
效果:

1 | <img src= "/i/eg_tulip.jpg" alt= "郁金香" height= "100px" /><img src= "/i/eg_tulip.jpg" alt= "郁金香" height= "100px" />
|
效果:

2、在img标签的父级上写:font-size:0;//这个在解决display:inline-block出现的问题也有帮助
1 2 3 4 | <div style= "font-size:0" >
<img src= "/i/eg_tulip.jpg" alt= "郁金香" height= "100px" />
<img src= "/i/eg_tulip.jpg" alt= "郁金香" height= "100px" />
</div>
|
效果:

3、使用display:block(img是内联元素)//要float一下才行
1 2 | <img src= "/i/eg_tulip.jpg" alt= "郁金香" height= "100px" style= "display:block" />
<img src= "/i/eg_tulip.jpg" alt= "郁金香" height= "100px" style= "display:block" />
|
效果:

4、使用letter-spacing属性
1 2 3 4 | <div style= "letter-spacing:-800px" ><!--letter-spacing的值无论是负多少都不会产生重叠-->
<img src= "/i/eg_tulip.jpg" alt= "郁金香" height= "100px" />
<img src= "/i/eg_tulip.jpg" alt= "郁金香" height= "100px" />
</div>
|
效果:

以上就是css中怎么取消图片间隔的详细内容,更多文章请关注木庄网络博客!
相关阅读 >>
css怎么设置行高
css column-span属性怎么用
css如何禁止滑动
css link与import的区别是什么
css怎么设置超链接颜色
css column-rule-color属性怎么用
css 外边距合并是什么意思
css目标伪类是什么
css怎么加阴影
css常见样式
更多相关阅读请进入《css》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » css中怎么取消图片间隔