Question

也许我错过了一些简单的东西，但我试图在Stacked栏上放置一些文字用于Twitter-Bootstrap的进度条： Stacked Bar

<div class="progress">
   <div class="progress-bar progress-bar-success" style="width: 50%">
      <span class="sr-only">50%</span>
   </div>
   <div class="progress-bar progress-bar-warning progress-bar-striped" style="width: 20%">
      <span class="sr-only">20%</span>
   </div>
   <div class="progress-bar progress-bar-danger" style="width: 30%">
      <span class="sr-only">30%</span>
   </div>
</div>

JSFiddle DEMO

我只是想在堆叠条的每个部分上显示文本（50％，20％，30％），但我无法弄清楚正确的实现。任何帮助非常感谢！

谢谢！

Answer 1

根据Twitter Bootstrap Docs，sr-only类可以隐藏除屏幕阅读器之外的所有设备的元素。因此，在这种情况下，它会隐藏您要在除SR之外的所有其他设备上显示的标签。

删除课程并且有效。

Updated JSFiddle

Bootstrap进度条，将文本放在“Stacked”栏上

1 个答案: