---
# System prepended metadata

title: align-items - 交錯軸對齊方式
tags: [css]

---

---
tags: css
---
#  align-items - 交錯軸對齊方式

* 我們運用交錯軸，對齊置中方式

> 初設定狀態

![](https://i.imgur.com/nfWTMKd.png)

```css=
justify-content:center
```
* 主軸線水平置中

![](https://i.imgur.com/NyCBmbH.png)

* 再運用交錯軸，上下置中

```css
align-items:center
```

![](https://i.imgur.com/swrY9Ti.png)