css 为什么在我的元素下会出现4px的额外填充< a>？

uxh89sit 于 2022-11-27 发布在其他

关注(0)|答案(4)|浏览(128)

H3LLO，
由于某种原因，在a元素下出现了4px的额外填充。我在Firefox和Chrome中都看到了这种情况。我记得在Flickr早期看到过这种现象，除了它是一个蓝色的条，出现在元素包裹的s下。
这里有一个link to the example code来说明我的问题。背景：的a已被标为红色，并且边框：的img已被着色为灰色。如您所见，a元素在img下方延伸了约4px。
要查看代码，只需点击“Edit using JSBIN”链接，当您将鼠标悬停在窗口上方时，该链接会出现在右上角。
关于如何去除a元素的额外底部填充，有什么想法吗？
谢谢
阿当

css

来源：https://stackoverflow.com/questions/3407292/how-come-there-is-4px-of-extra-padding-appearing-under-my-a-element

4条答案

按热度按时间

72qzrwbm1#

将vertical-align:bottom;添加到img css属性中。

赞(0）回复(0）举报 2022-11-27

avwztpqn2#

a {display: inline-block}
img {display: block}

默认情况下，图像是内联渲染的，您需要添加display: block或vertical-align: bottom来解决此问题。

赞(0）回复(0）举报 2022-11-27

x6492ojm3#

对我来说唯一有效的方法是“删除”边距，即用div包裹图像，并将div的大小设置为与图像完全相同。

<div style="width:64px; height:64px">
  <img src ='image.png' style="width:64px; height:64px" />
</div>

赞(0）回复(0）举报 2022-11-27

bq8i3lrv4#

我不确定为什么会发生这种情况，但是您可以尝试使用YUI Reset来修复它。

赞(0）回复(0）举报 2022-11-27

我来回答

css 为什么在我的元素下会出现4px的额外填充< a>？

4条答案

相关问题

热门标签

最新问答