text-right

  <div class="card-columns">
    <!-- ★複数のカードをレイアウトするためにcard-columnsを使う、flex同様、自動整列される -->
    <div class="card">
      <img class="card-img-top" src="https://via.placeholder.com/640x480/FFFF00/000000?text=.card-img-top" alt="...">
      <div class="card-body">
        <h4 class="card-title">カード01</h4>
        <p class="card-text">ここに文章が入ります</p>
      </div>
    </div>
    <!-- カード02 -->
    <div class="card p-3">
      <blockquote class="blockquote mb-0 card-body">
        <p>カード02</p>
        <p>文章</p>
        <footer class="blockquote-footer"> <small class="text-muted">文章</small> </footer>
      </blockquote>
    </div>
    <!-- カード03 -->
    <div class="card">
      <img class="card-img-top" src="https://via.placeholder.com/640x480/FFFF00/000000?text=.card-img-top" alt="...">
      <div class="card-body">
        <h4 class="card-title">カード03</h4>
        <p class="card-text">文章</p>
        <p class="card-text"><small class="text-muted">文章</small></p>
      </div>
    </div>
    <!-- カード04 -->
    <div class="card bg-secondary text-white text-center p-3">
      <blockquote class="blockquote mb-0">
        <p>カード04</p>
        <p>文章</p>
        <footer class="blockquote-footer"> <small> 文章 </small> </footer>
      </blockquote>
    </div>
    <!-- カード05 -->
    <div class="card text-center">
      <div class="card-body">
        <h4 class="card-title">カード05</h4>
        <p class="card-text">文章</p>
        <p class="card-text"><small class="text-muted">文章</small></p>
      </div>
    </div>
    <!-- カード06 -->
    <div class="card">
      <img class="card-img" src="https://via.placeholder.com/640x480/FFFF00/000000?text=Card 06" alt="...">
    </div>
    <!-- カード07 -->
    <div class="card p-3 text-right">
      <blockquote class="blockquote mb-0">
        <p>カード07</p>
        <p>文章</p>
        <footer class="blockquote-footer"> <small class="text-muted">文章</small> </footer>
      </blockquote>
    </div>
    <!-- カード08 -->
    <div class="card">
      <div class="card-body">
        <h4 class="card-title">カード08</h4>
        <p class="card-text">文章</p>
        <p class="card-text"><small class="text-muted">文章</small></p>
      </div>
    </div>
  </div>

  <!-- 標準（左寄せ） -->
  <div class="card">
    <div class="card-body">
      <h4 class="card-title">標準（左寄せ）</h4>
      <p class="card-text">カードの内容</p>
      <a href="#" class="btn btn-primary">ボタン</a>
    </div>
  </div>
  <!-- divに設定する、中央寄せ：text-center -->
  <div class="card text-center">
    <div class="card-body">
      <h4 class="card-title">中央寄せ：text-center</h4>
      <p class="card-text">カードの内容</p>
      <a href="#" class="btn btn-primary">ボタン</a>
    </div>
  </div>
  <!-- divに設定する、右寄せ：text-right -->
  <div class="card text-right">
    <div class="card-body">
      <h4 class="card-title">右寄せ：text-right</h4>
      <p class="card-text">カードの内容</p>
      <a href="#" class="btn btn-primary">ボタン</a>
    </div>
  </div>

  <p class="text-left">text-left</p>
  <p class="text-center">text-center</p>
  <p class="text-right">text-right</p>

  <blockquote class="blockquote text-right">
    <p class="mb-0">基本の引用文です。</p>
    <footer class="blockquote-footer">文章の<cite title="引用元の名前">引用元</cite>が明示できます。</footer>
  </blockquote>

  <figure class="figure">
    <img src="https://via.placeholder.com/400x300/FFFF00/000000?text=img" class="figure-img img-fluid" alt="図表の画像">
    <figcaption class="figure-caption text-right">図表キャプション右寄せ（text-right）</figcaption>
  </figure>