我有以下代码，它允许红色从 a 元素中显示出来。为什么是这样。我本以为 a 元素只会扩展到内容的大小，但看起来它比这个大一点。请参阅此处的代码笔http://codepen.io/anon/pen/soqEz.
HTML
<a href="#"><img src="http://placehold.it/150x150" /></a>
CSS
a{
background: red;
margin-bottom:0;
padding-bottom:0;
border-bottom:0;
}
img {
margin-bottom:0;
padding-bottom:0;
border-bottom:0;
}
编辑：我看到下面的答案......但任何人都可以解释一下why空间就在那里（我的意思是考虑到它是一个块级元素......它首先的目的是什么）......而不是试图摆脱它。谢谢
The img元素是inline默认情况下。inline元素充当文本并默认为vertical-align: baseline。这意味着图像的底部与文本的底部对齐。请注意，小写的 p 或 g 位于垂直文本对齐方式的底部下方。您可以通过添加来修复它vertical-align: bottom OR display: block.
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
