详解CSS清除图片下几像素空白间隙的方法
程序员文章站
2022-07-04 20:28:07
最近有伙伴问小编的问题:页面排版的时候发现图片下面有那么1-2像素的间隙空白,怎么去除。这个是浏览器的一个设计问题。img本来是行内元素,却可以用width 和height,当父元素没有设置高度的时候...
最近有伙伴问小编的问题:
页面排版的时候发现图片下面有那么1-2像素的间隙空白,怎么去除。
这个是浏览器的一个设计问题。img本来是行内元素,却可以用width 和height,当父元素没有设置高度的时候,用子元素们的高度计算出的高度给父元素的时候就会出现3px空隙这类的问题。
去除图片下间隙的方法一
img{display:block;}
方法2
img{vertical-align:top;}
除了top值,还可以设置为text-top | middle | bottom | text-bottom,甚至特定的<length>和<percentage>值都可以
方法3
#qdxw{font-size:0;line-height:0;} #qdxw为img的父元素
总结
到此这篇关于详解css清除图片下几像素空白间隙的方法 的文章就介绍到这了,更多相关css 清除图片几像素空白间隙内容请搜索以前的文章或继续浏览下面的相关文章,希望大家以后多多支持!
上一篇: iOS开发之在列表上方添加水印的方法
下一篇: Win10新/旧开始菜单有什么变化?