时间戳

首页 > 解决方案 > 将边框放在空白进度条中

css - 将边框放在空白进度条中

问题描述

我正在使用引导进度条。我的代码如下

<div class="progress">
  <div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
</div>

我想在进度条上方放置边框。

标签： cssbootstrap-4progress-barborder

解决方案

<!-- bootstrap.min.css -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.0/css/bootstrap.min.css" rel="stylesheet" />

<div class="progress border border-success">
  <div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
</div>

请在引导程序中添加边框类

也可以添加颜色

  • border-success
  • border-info
  • border-danger
  • border-warning
  • border-secondary
  • border-primary
  • border-whiteETC

推荐阅读