img图片底部出现莫名的下边距问题
谷歌中这样是解释的:
图片底部的空隙实际上涉及行内元素的布局模型,图片默认的垂直对齐方式是基线,而基线的位置是与字体相关的。所以在某些时候,图片底部的空隙可能是 2px,而有时可能是 4px 或更多。不同的 font-size 应该也会影响到这个空隙的大小。
解决办法:
给img定义vertical-align或者display:block;,最优的解决办是定义vertical-align,注:定义vertical-align为middle时在IE6中大概还有一像素的顶边距,最好为top或bottom。当然还有种极端解决办法大家可以试试就是将 父容器的字体大小为零,font-size:0
如果您对本文有什么疑问,欢迎提出个人见解,若您觉得本文对你有用,不妨帮忙点个赞,或者在评论里给我一句赞美,小小成就都是今后继续为大家编写优质文章的动力, 欢迎您持续关注我的博客:)
作者:Jesse131
出处:http://www.cnblogs.com/jesse131/
关于作者:专注前端开发。如有问题或建议,请多多赐教!
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文链接。