css buttom居中

CSS中的button有许多不同的设置，其中包括居中设置。居中按钮意味着无论屏幕大小或设备类型如何，按钮始终保持在页面的中央位置。下面是一个关于如何在 CSS 中居中 button 的指南。

button {
  display: block; /* 不选择这种设置会使button左对齐，不占据居中的位置 */
  margin: auto; /* margin完全居中button */
}

您还可以使用FlexBox来实现按钮的居中设置。FlexBox是一个灵活的布局，可以使页面的不同元素容易地居中 - 包括按钮。下面是如何使用FlexBox居中button的代码示例：

.container {
  display: flex;
  justify-content: center;
  align-items: center;
}
button {
  /* 这个的实际使用看情况，一般是仅当button在容器内时需要设置为auto */
  margin: auto;
}

无论您选择哪种方法，都可以轻松地使按钮在页面上居中。这是一个常见的问题，需要经常解决，但当您达到居中按钮的目标时，页面会看起来更干净、更专业，访客体验会大大提高。