简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Heim > Web-Frontend > HTML-Tutorial > Hauptteil

img图片底部出现莫名的下边距问题_html/css_WEB-ITnose

WBOY
Freigeben： 2016-06-24 11:37:45
Original
974 Leute haben es durchsucht

谷歌中这样是解释的：

图片底部的空隙实际上涉及行内元素的布局模型，图片默认的垂直对齐方式是基线，而基线的位置是与字体相关的。所以在某些时候，图片底部的空隙可能是 2px，而有时可能是 4px 或更多。不同的 font-size 应该也会影响到这个空隙的大小。

解决办法：

给img定义vertical-align或者定义为块状，最优的解决办是定义vertical-align，注：定义vertical-align为middle时在IE6中大概还有一像素的顶边距，最好为top或bottom。当然还有种极端解决办法大家可以试试就是将 父容器的字体大小为零，font-size:0

Verwandte Etiketten：
img图片底部出现莫名的下边距问题
Quelle：php.cn
Vorheriger Artikel：使用Axure RP原型设计实践04,了解全局变量_html/css_WEB-ITnose Nächster Artikel：CSS3鼠标悬停图片动画_html/css_WEB-ITnose
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Aktuelle Ausgaben
java - Android布局上下两层，底层播放视频，上层有输入框，当软键盘弹出时如何才能不挤压底层视频层呢？ 问题的描述在底下，输入框位于屏幕的最底部，第一张图没有体现出来，输入框位于最底部哈下边看两张图：下边的截图是从印客直播截取的第一张图没有软键盘时 第二张图软键盘弹出时 以上截图就是...
Aus 2017-04-18 09:24:48
0
4
158
javascript - 悬浮div超出父div范围 想实现一个效果： 鼠标放在文章标题上，悬浮出图片和简介。 但是 靠近底部的悬浮div始终无法突破下边界，导致一部分无法显示，想让该悬浮的div能在<footer&am...
Aus 2017-04-10 17:04:46
0
2
215
javascript - 延迟加载的这段代码哪里有问题呢？ 下面是个人代码，思路是监视文档滚轮事件，若img出现在视口了就设置该img的src属性，现在问题是我的这段代码，鼠标一滚轮所有图片都显示了，我自己看了下自己写的代码，疑惑的是在循环...
Aus 2017-04-10 16:45:50
0
3
226
verwandte Themen
Mehr>
Beliebte Empfehlungen
Beliebte Tutorials
Mehr>
Verwandte Tutorials
Beliebte Empfehlungen
Aktuelle Kurse
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website：Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！