css自适应全局居中

CSS自适应全局居中通常通过`Flexbox`或`Grid`布局以及一些相对单位（如百分比、em等）来实现。以下是两种常见的方法：

1. **Flexbox** 局部居中：

   .container {
     display: flex;
     justify-content: center; /* 水平居中 */
     align-items: center; /* 垂直居中 */
     height: 100%; /* 如果是body或其他需要全屏高度的情况 */
     position: relative; /* 或者给父元素设定position */
   }

2. **CSS Grid** 局部居中：

   .container {
     display: grid;
     place-items: center; /* 自动水平垂直居中 */
     height: 100vh; /* 视口高度 */
   }

   或

   .container {
     display: grid;
     grid-template-columns: auto auto;
     justify-items: center;
     align-items: center;
   }

如果要实现真正的全局居中，通常会在`html`和`body`标签上应用相应的样式，并且可能需要考虑浏览器的最小视口宽度，因为字体大小和行高等因素会影响元素的实际尺寸。