css - 如何在引导进度条中垂直对齐文本

Question

我修改了引导进度条的高度，您可以在以下链接中看到：http: //jsfiddle.net/8Xf2j/31/

我想要做的是文本垂直居中。我试图添加属性：

vertical-align:middle

但它不起作用......我还想增加包含进度条的文本的字体大小添加：

font-size:30px;

正如您将在 de fiddle 中看到的那样，它也不起作用。任何想法或建议将不胜感激。

Answer 1

实现单行文本垂直对齐的一种方法是使line-height匹配达到所需的高度。

示例：http: //jsfiddle.net/VQS2k/

.progress {
    height: 40px;
    font-size: 30px;
}
.bar {
    font-size: 30px;
    line-height: 40px;
}

普通版（无引导）：http: //jsfiddle.net/VQS2k/1/