uniapp 按钮居中

在 UniApp 开发中，如果你想让按钮在页面上水平和垂直方向上都居中，你可以使用 CSS 的 `flexbox` 布局或者自定义样式。这里提供两种常见的方法：

1. 使用 Flexbox 居中：

<view class="container">
  <button class="center-btn">按钮内容</button>
</view>

<style scoped>
.container {
  display: flex;
  justify-content: center; /* 水平居中 */
  align-items: center; /* 垂直居中 */
  height: 100%; /* 或者设定一个具体的高度 */
}
.center-btn {
  /* 其他按钮样式 */
}
</style>

2. 使用 CSS 自定义样式：

<view class="container">
  <button class="center-btn">按钮内容</button>
</view>

<style scoped>
.container {
  position: relative; /* 父元素需要定位 */
  width: 100%; /* 或者设定一个具体的宽度 */
  height: 100%; /* 或者设定一个具体的高度 */
}

.center-btn {
  position: absolute; /* 子元素需要绝对定位 */
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); /* 使按钮中心对齐 */
  /* 其他按钮样式 */
}
</style>