Home > Article > Web Front-end > 为什么a标签中使用img后的高度多了几个像素？_html/css_WEB-ITnose
为什么a标签中使用img后的高度多了几个像素？_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 11:20:18988browse
a元素下有一个匿名文本，这个文本外有一个匿名行级盒子，它有的默认vertical-align是baseline的，而且往往因为上文line-height的影响，使它有个line-height，从而使其有了高度，因为baseline对齐的原因，这个匿名盒子就会下沉，往下撑开一些距离，所以把a撑高了。
解决办法一：是消除掉匿名盒子的高度，也就是给a设置line-height:0或font-size:0;
解决办法二：是给两者vertical-align:top，让其top对齐，而不是baseline对齐
解决办法三：是给img以display:block，让它和匿名行级盒子不在一个布局上下文中，也就不存在行级盒的对齐问题
其他解决办法也有，但这些都是从根本上解决问题
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：CSS3径向渐变大鱼吃小鱼之孤单的大鱼_html/css_WEB-ITnoseNext article：CSS彻底研究(3)-浮动,定位_html/css_WEB-ITnose