CSS居中（包括水平居中和垂直居中）的方案有哪些 ？

CSS中实现元素居中的方法很多，具体的方法取决于你的布局需求和要居中的元素的特性。以下是一些常见的水平居中和垂直居中的方法：

1. 行内元素的水平居中：可以通过设置父元素的 text-align: center; 来实现。

2. 块级元素的水平居中：如果元素的宽度已知，可以通过设置 margin-left 和 margin-right 为 auto 来实现。

3. 绝对定位元素的水平居中：如果元素使用了绝对定位，可以通过设置 left: 50%; 和 transform: translateX(-50%); 来实现。

4. Flex布局的水平居中和垂直居中：设置父元素为Flex布局，然后通过 justify-content: center;（水平居中）和 align-items: center;（垂直居中）来实现。

5. 单行文本的垂直居中：可以通过设置 line-height 等于元素的高度来实现。

6. 绝对定位元素的垂直居中：如果元素使用了绝对定位，可以通过设置 top: 50%; 和 transform: translateY(-50%); 来实现。

7. Grid布局的水平居中和垂直居中：设置父元素为Grid布局，然后通过 justify-items: center;（水平居中）和 align-items: center;（垂直居中）来实现。

以上只是一部分方法，CSS中还有许多其他的方法可以实现元素的居中。不同的方法有各自的优点和适用场景，需要根据实际需求来选择合适的方法。