# 寫在母元素 ## grid ```css= display: grid; ``` ## grid-template-columns 子元素水平方向長度 單位可用:px、fr 寫幾個數字代表水平方向可以排幾個子元素 ### 範例 ```css= grid-template-columns: 100px 100px 1fr; ``` 水平方向有3個子元素 第1垂直列水平長100px 第2垂直列水平長100px 第3垂直列水平長把剩餘空間占滿 ### fr 1fr剩餘空間占滿 ## row-gap 上下的間隔 ## column-gap 左右的間隔