如果栏为空，则在引导程序进度条上显示文本

Question

所以我有一个引导进度条，其中文本显示在栏中 - 我注意到文本只显示栏是否有一些填充量，但如果栏是空的，则文本不是＆＃39 ;显示？

如果条形图是空的还是满的，或者介于两者之间的任何位置，如何编辑此HTML以显示条形图内的文本？

 <div class="progress">
  <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="30" aria-valuemin="0" aria-valuemax="100" style="width: 30%;">
    This is my text
  </div>
</div>

Answer 1

来自Bootstrap Docs

  

要确保标签文本即使在低百分比下仍然清晰可读，请考虑在进度条中添加最小宽度。

<div class="progress">
  <div class="progress-bar" role="progressbar" 
     aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" 
     style="min-width: 20%"> <!-- or use ems/pixels -->
    This is my text
  </div>
</div>

在你的情况下，也许这样的事情会起作用：

{{1}}