导航中的线高VS填充（正确方法）

Question

我刚刚回到编码中，我想知道为我的btn添加高度的最佳方法是什么。

这是代码 -

填充方法

.nav-main li a {
  display: block;
  padding: 70px 10px 70px 10px;
  color: #6CF784;
  border-bottom: 10px solid white;
  text-decoration: none; 
}

行高法

.nav-main li a {
  display: block;
  padding: 0 10px 0 10px;
  line-height: 150px;
  color: #6CF784;
  border-bottom: 10px solid white;
  text-decoration: none; 
}

Answer 1

我喜欢使用line-height，因为它正确定位基线以使文本出现在元素的中间（而填充它可能偏离中心，单向或基于字体）< / p>

当然，这取决于您使用line-height的像素值（正如您在问题中所做的那样） - 使用像1.5这样的数值可能会产生不同的结果，具体取决于字体。< / p>

Answer 2

我个人使用填充，因为它让我可以更好地控制浏览器，因为行高可能因您使用的字体而异，以及客户浏览器上安装/未安装的字体。