Css 垂直居中按钮文本,其下方的固有空间大于上方

Css 垂直居中按钮文本,其下方的固有空间大于上方,css,Css,我的按钮,定义为,样式为.button{background:red;padding:20px;},没有垂直居中,因为我使用的字体下面比上面有更多的固有空间。有没有一种方法可以在不改变标记的情况下将其居中,如果没有,最好的选择是什么 编辑:使用行高代替填充适用于默认字体,而不是我正在使用的字体 (按钮周围的灰色是我的页面背景而不是边框)使用行高。这将设置文本的高度,并在垂直方向上提供不可见的相等填充。请注意,此技巧仅适用于块元素。因此,如果要在a标记上使用它,则需要将其转换为块元素(使用dis

我的按钮,定义为
,样式为
.button{background:red;padding:20px;}
,没有垂直居中,因为我使用的字体下面比上面有更多的固有空间。有没有一种方法可以在不改变标记的情况下将其居中,如果没有,最好的选择是什么

编辑:使用
行高
代替填充适用于默认字体,而不是我正在使用的字体


(按钮周围的灰色是我的页面背景而不是边框)

使用
行高
。这将设置文本的高度,并在垂直方向上提供不可见的相等填充。请注意,此技巧仅适用于块元素。因此,如果要在
a
标记上使用它,则需要将其转换为块元素(使用
display:block

a按钮{
背景:红色;
颜色:白色;
文本对齐:居中;
宽度:100px;
/*神奇的线条*/
线高:3em;
显示:块;
}

Text
使用行高属性而不是填充进行垂直居中对齐

似乎不适用于我使用的字体。如果我使用默认字体,它仍然可以工作。在这种情况下,您可能需要添加一些
填充顶部
来调整它。谢谢,但与我正在使用的字体不兼容。@drake035是否可以编辑代码以包含您正在使用的字体以及应用于此处元素的任何其他css?将行高设置为框高