button的line-height影响对齐的问题，谁能给解释一下？
来源：-
sxlyq
2016-02-21 21:43
#btn1{
height: 15px;
line-height: 0;
}
#btn2{
height: 15px;
line-height: normal;
}
#btn1{
height: 25px;
line-height: 0;
}
#btn2{
height: 25px;
line-height: normal;
}
写回答
关注
1回答
-
- qq_一桥轻雨一伞开_2
- 2017-08-08 14:05:01
line-height:normal是浏览器自动计算的合适的行高，一般为font-size的1.14倍，而且每个浏览器解析的不太一样。你的代码中没写字体大小，那默认就是16px，那么行高为19px左右。第一个例子中你给的高度是15px，小于行高，我的理解是行高将button顶上去了。设置行高为0的button就不会受影响了。第二个例子中行高给了25px，比行高要高了，所以两个button近似对齐。行高并不会影响button的高度，没有文字的话两个button都是对齐的
CSS深入理解之vertical-align
深入理解vertical-align的属性值，分享开发中应用经验
39336 学习 · 57 问题
相似问题