如何在进度条引导程序中垂直对齐文本

Question

我决定更改进度条的高度，但文本似乎没有在进度条内垂直对齐。

这是我制作的jsfiddle。

jsfiddle

<div class="container">
    <div class="progress" style="height:40px;">

  <div class="progress-bar progress-bar-success" style="width: 50%">
  </div>
  <div class="progress-bar progress-bar-warning" style="width: 27%">
   <span style="" id="spanP">60%</span>
  </div>

</div>
</div>

Answer 1

更改跨度的行高。

<div class="container">
    <div class="progress" style="height:40px;">

  <div class="progress-bar progress-bar-success" style="width: 50%">
  </div>
  <div class="progress-bar progress-bar-warning" style="width: 27%">
   <span style="line-height: 39px;" id="spanP">60%</span>
  </div>

</div>
</div>

此致