本文介绍了链接图片上的额外填充（在每个broswer中）的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
m有一个问题，在链接元素与内部的图像获得额外的填充。它会发生在所有浏览器，Safari，Firefox，IE。
Hello, I'm having a problem with getting extra padding on link element with an image inside. It happens in all browsers, Safari, Firefox, IE.
我有一个重置样式表，所以应该不会有任何额外的边距填充，但检查后， a 元素有一些额外的底部填充从无处。任何想法？
I have a reset stylesheet applied so there shouldn't be any extra margins on padding but upon inspection it's clear that the a element has some extra bottom padding from nowhere. Any ideas?
以下是标记和CSS：
< div class = movie>< a href =>< img src =img / video01.jpgalt =/>< / a>< / div>
div.home-col .movie {
padding: 0 0 11px 0;
background: url(../img/bg-shadow-movie.png) bottom no-repeat;
}
div.home-col .movie a {
display: block;
background: url(../img/bg-zoom-movie.png) 50% 5px no-repeat;
}
div.home-col .movie img {
padding: 4px;
margin: 0;
border: 1px solid #d0d0d0;
}
推荐答案
尝试将以下行添加到您的连结元素： line-height：0;
Try adding the following line to your link element: line-height: 0;
div.home-col .movie a {
display: block;
background: url(../img/bg-zoom-movie.png) 50% 5px no-repeat;
line-height: 0;
}
这篇关于链接图片上的额外填充（在每个broswer中）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！