如何在bootstrap 4中将卡片按钮移动到底部？

<div class="card">
  <div class="card-body">
    <h5 class="card-title">Card Title</h5>
    <p class="card-text">Card content goes here.</p>
    <button class="btn btn-primary mt-auto">Button</button>
  </div>
</div>

<style>
  .card {
    display: flex;
    flex-direction: column;
    height: 100%;
  }

  .card-body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
  }

  .mt-auto {
    margin-top: auto;
  }
</style>