用css写个盒子内部按钮居下方中间对齐

可以使用相对定位和负值来实现：

HTML代码：

<div class="box">
  <button>按钮</button>
</div>

CSS代码：

.box {
  width: 200px;
  height: 200px;
  background-color: #ccc;
  position: relative;
}

button {
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translate(-50%, 50%);
}

解释一下：

1. 父盒子设置了相对定位，子元素设置了绝对定位，这样子元素的位置就是相对于父盒子的。

2. left: 50%; 设置按钮左边缘距离父盒子左边框的距离为父盒子宽度的一半，这样按钮就在父盒子的中间了。

3. bottom: 0; 设置按钮底部距离父盒子底部的距离为0，这样按钮就在父盒子的底部了。

4. transform: translate(-50%, 50%); 通过负值的方式将按钮向上移动50%的高度，使其能够在父盒子的底部居中对齐。

效果如下：

![居下方中间对齐的按钮](https://i.imgur.com/hW8JYJq.png