button按钮居中

在网页设计或UI开发中，让按钮水平垂直居中通常有几种常见的方法：

1. **CSS Flexbox**：对于现代浏览器，可以利用Flexbox布局，给包含按钮的容器设置`display: flex; justify-content: center; align-items: center;`。这样按钮就会在其父元素内部居中。

.container {
   display: flex;
   justify-content: center;
   align-items: center;
}

2. **CSS Grid**：另一种方式是使用Grid布局，同样需要对容器设置相应的属性：

.container {
   display: grid;
   place-items: center;
}

3. **绝对定位**：如果按钮是某个相对固定位置的直接子元素，可以使用绝对定位(`position: absolute`)配合top, right, bottom, left设置为0：

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

4. **内联样式**：如果按钮是一个独立的`<button>`元素，可以使用`margin: auto`使其水平居中，加上合适的`width`使其在行上居中：

button {
   margin: 0 auto;
   width: 50%; /* 或者适当宽度 */
}