在CSS中，我們可以使用`auto`關(guān)鍵字來實現(xiàn)元素的自動居中，這種技術(shù)通常用于水平居中，但也可以用于垂直居中，下面是一些示例，說明如何在CSS中使用`auto`來自動居中元素。
### 水平居中
1. 使用text-align
對于文本元素，可以使用`text-align: center;`來水平居中。
```css
.text-center {
text-align: center;
}
```
```html
```
2. 使用margin
對于塊級元素，可以使用`margin: auto;`來水平居中。
```css
.block-center {
margin: auto;
width: 50%; /* 寬度設為50%以便居中 */
}
```
```html
```
### 垂直居中
1. 使用position
可以使用`position: absolute; top: 50%; transform: translateY(-50%);`來垂直居中。
```css
.vertical-center {
position: absolute;
top: 50%;
transform: translateY(-50%);
}
```
```html
```
2. 使用flexbox
使用`display: flex; align-items: center;`來垂直居中。
```css
.vertical-center {
display: flex;
align-items: center;
}
```
```html
```
### 綜合示例
下面是一個綜合示例，展示如何在CSS中使用`auto`來自動居中元素：
```html
```
希望這些示例能幫助你理解如何在CSS中使用`auto`來自動居中元素。
