本文摘自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文件的扩展名是什么?
怎么加载css文件
css如何去掉图片边框
css如何使用伪元素清除浮动
css文件中如何引入另一个css文件?(代码示例)
css输入框怎么设置不可编辑
css border-left-style属性怎么用
margin-top在html中的意思是什么
div在屏幕中如何实现水平居中和垂直居中
更多相关阅读请进入《css》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » css中怎么取消图片间隔