这是我的CSS / LESS CSS代码到目前为止：
//make navbar taller
@navbarHeight: 60px;
//make navbar link text 18px
.navbar-inner {
font-size: 18px;
}
//make navbar brand text 36px
.navbar .brand {
font-size: 36px;
}
哪个产生：
我使用Twitter Bootstrap演示代码，我没有改变html(除了改变品牌名称)。
您可以看到，品牌名称在导航栏内垂直居中，就像它应该是一样，但导航链接不是(它们比顶端更高)。一旦我改变了导航栏的高度，这个问题就变得很明显。如何让他们垂直居中(例如this网站)？
如果有任何帮助，请在Chrome中突出显示元素：
解决方法
.brand类使用与Bootstrap中使用的基本文本不同的行高以及其他一些关键差异。
来自原始引导导航栏的相关部分LESS –
对于.brand：
.brand {
// Vertically center the text given $navbarHeight
@elementHeight: 20px;
padding: ((@navbarHeight - @elementHeight) / 2 - 2) 20px ((@navbarHeight - @elementHeight) / 2 + 2);
font-size: 20px;
line-height: 1;
}
导航栏中的链接：
.navbar .nav > li > a {
@elementHeight: 20px;
padding: ((@navbarHeight - @elementHeight) / 2 - 1) 10px ((@navbarHeight - @elementHeight) / 2 + 1);
line-height: 19px;
}
您可能需要使用@elementHeight，line-height的值，并可能需要播放.navbar .nav>的填充值。 li>一个选择器来反映较大的60px @navbarHeight(这些默认值适用于40px @navbarHeight)。也许尝试一个40px @elementHeight和/或29px的行高开始。
