border-primary

bootstrap5.css

.border-primary {
  border-color: #007bff !important;
}

html bootstrap5 Sample

カードのデフォルトのボーダー色を変更する：border-primary

カードのヘッダー

カードのタイトル

カードの内容

カードのヘッダー

カードのタイトル

カードの内容

  <div class="card mb-3" style="max-width: 25rem;">
    <div class="card-header">カードのヘッダー</div>
    <div class="card-body">
      <h4 class="card-title">カードのタイトル</h4>
      <p class="card-text">カードの内容</p>
    </div>
  </div>
  <!-- カード枠のボーダー色：青 border-primary -->
  <div class="card border-primary mb-3" style="max-width: 25rem;">
    <!-- ヘッダーのボーダー色：青 border-primary -->
    <div class="card-header border-primary">カードのヘッダー</div>
    <div class="card-body">
      <h4 class="card-title">カードのタイトル</h4>
      <p class="card-text">カードの内容</p>
    </div>
  </div>

ボーダー色を設定する：border-*

border-primary border-secondary border-success border-danger border-warning border-info border-light border-dark border-white

  <span class="border border-primary">border-primary</span>
  <span class="border border-secondary">border-secondary</span>
  <span class="border border-success">border-success</span>
  <span class="border border-danger">border-danger</span>
  <span class="border border-warning">border-warning</span>
  <span class="border border-info">border-info</span>
  <span class="border border-light">border-light</span>
  <span class="border border-dark">border-dark</span>
  <span class="border border-white">border-white</span>