-
屬性 justify-item 水平 align-item 垂直 place-item 垂直 水平 屬性值 start end center strength查看全部
-
justify-self 和 align-self (網格項本身的布局)
start/end/center/stretch
查看全部 -
grid-area簡寫與等價原寫法
查看全部 -
grid-area的簡寫,與等價寫法
查看全部 -
span <number>的作用:
案例二:?
查看全部 -
隱式網格軌道的出現(xiàn):
?
查看全部 -
?start\end網格線布局效果
查看全部 -
在容器寬度內,auto-fill:可重復自動填充列數,不用像之前那樣設定多少列數;auto-fit:有多少個網格項來確定可以有多少網格列
auto-fill、auto-fit要在repeat()中結合其他函數一起使用才有效,一般結合minmax()使用。
查看全部 -
minmax設置最小最大的列寬范圍,一般在repeat()中結合auto-fill、auto-fit使用發(fā)揮用處大。
查看全部 -
顯示3列,
max-content:列寬為內容的最大寬度,min-content:列寬為內容的最小寬度。
查看全部 -
fit-content:與repeat()一樣只能用于grid-template-columns/rows。
fit-content(100px):表示最大是100px列寬。
查看全部 -
本章所講的grid屬性有:
display
grid-template-rows(行高),grid-template-columns(列寬),grid-template-areas。簡寫:grid-template
grid-row-gad(行間距),grid-column-gad(列間距)。簡寫:grid-gad(行,列)或gad(行,列)
注:gad 舊低版瀏覽器不支持
justify-items(水平方向) 和 align-items(垂直方向)
簡寫:place-items(垂直,水平)
justify-content(水平方向) 和 justify-content(垂直方向)
簡寫:place-content(垂直,水平)
grid-auto-rows,grid-auto-columns,grid-auto-flow(自動布局算法的工作方式)。
grid-auto:用于指定自動生成的網格軌道(也叫隱式網格軌道)的大小。
隱式網格軌道:指超出指定網格范圍的行/列時被創(chuàng)建的軌道。
查看全部 -
簡寫網格區(qū)域areas
查看全部 -
grid簡寫屬性值設置解析
查看全部 -
grid簡寫,匯總寫一起的語法
查看全部
舉報