css水平居中

要实现CSS水平居中，常用的方法有以下几种：

1. 使用`text-align: center;`来居中文本或者内联元素，该方法适用于父元素为块级元素的情况。

```css

.parent {

text-align: center;

}

```

2. 使用`margin: 0 auto;`来居中块级元素，该方法适用于父元素为块级元素的情况。

```css

.child {

margin: 0 auto;

}

```

3. 使用Flexbox布局来实现水平居中，该方法适用于父元素为块级元素的情况。

```css

.parent {

display: flex;

justify-content: center;

}

```

4. 使用Grid布局来实现水平居中，该方法适用于父元素为块级元素的情况。

```css

.parent {

display: grid;

place-items: center;

}

```

5. 使用*定位和`left: 50%;`结合`transform: translateX(-50%);`来居中元素，该方法适用于元素的宽度是已知的情况。

```css

.child {

position: absolute;

left: 50%;

transform: translateX(-50%);

}

```