如何使用 CSS 使表格整体位于页面中间

使用CSS使整个表格居中，你可以通过设置表格的`position`属性为`relative`，然后将表格容器（通常是一个`div`或其他块级元素）设为`display: flex`，并应用`justify-content: center`和`align-items: center`来实现水平和垂直居中。以下是具体的代码示例：

.table-container {
  position: relative;
  display: flex;
  justify-content: center; /* 水平居中 */
  align-items: center; /* 垂直居中 */
}

.centered-table {
  margin: auto; /* 为了适应各种屏幕尺寸，让表格内容始终处于容器中心 */
}

然后在HTML中，给包含表格的元素添加上述类名：

<div class="table-container">
  <table class="centered-table">
    <!-- 表格内容 -->
  </table>
</div>

这样，无论表格的大小如何，它都会在页面的中央位置对齐。