如何将div放在容器的底部？

<div class="container">
  <div class="content">
    <!-- 在这里添加其他内容 -->
  </div>
  <div class="footer">Footer</div>
</div>

.container {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.content {
  flex-grow: 1;
}

.footer {
  /* 在这里添加footer的样式 */
}

<div class="container">
  <div class="content">
    <!-- 在这里添加其他内容 -->
  </div>
  <div class="footer">Footer</div>
</div>

.container {
  display: grid;
  grid-template-rows: 1fr auto;
  height: 100%;
}

.content {
  /* 在这里添加content的样式 */
}

.footer {
  /* 在这里添加footer的样式 */
}