如何设置div里面的元素靠底部对齐

要在一个div中将元素靠底对齐,你可以使用CSS的flex布局,具体步骤如下: 1. 设置父容器(即div)的样式为`display: flex; flex-direction: column; justify-content: flex-end;`。这样将div设置为flex布局,并且将子项在垂直方向上靠底显示。 2. 如果你想要子项在水平方向上居中对齐,可以再添加一个样式`align-items: center;`。 以下是一个示例代码:

```html
<div class="container">
  <div class="item">Item 1</div>
  <div class="item">Item 2</div>
  <div class="item">Item 3</div>
</div>

<style>
.container {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  height: 300px;
  border: 1px solid black;
}

.item {
  margin-bottom: 10px;
}
</style>
```

这样,div中的元素将被底对齐,并且在水平方向上居中对齐。你可以根据调整样式。

相关代码参考