Bootstrap 进度条 | Aria-Now 值已设置但仍为空白

Question

所以我已经成功制作了 bootstrap 进度条，但即使设置了 aria-now 值，进度条仍然是空的。我错过了什么？使用 jade 模板引擎构建。

div(class='progress bar' role='progressbar' aria-valuenow='45')

Answer 1

aria- 标签仅供 screen-readers 用于无法阅读您网站内容的用户。它们根本不会影响 DOM。它为空的原因是因为您需要将 DIV 包装在 .progress 元素中，然后给 .progress-bar 一个宽度属性 - width:60% 是进度条的百分比是什么（对不起，我不知道玉）

<div class="progress">
  <div class="progress-bar" role="progressbar" style="width: 60%;">
  </div>
</div>

如果您想添加屏幕 reader 数据，您可以按照 http://getbootstrap.com/components/#progress

Bootstrap 进度条 | Aria-Now 值已设置但仍为空白

Bootstrap Progress Bar | Aria-Now Value set but still blank

express

twitter-bootstrap

progress-bar

pug