CSS3 Grid 網(wǎng)格布局實(shí)戰(zhàn)
網(wǎng)格布局(Grid)是最強(qiáng)大的 CSS 布局方案。
它將網(wǎng)頁劃分成一個(gè)個(gè)網(wǎng)格,可以任意組合不同的網(wǎng)格,做出各種各樣的布局。
Grid 布局與 Flex 布局有一定的相似性,都可以指定容器內(nèi)部多個(gè)項(xiàng)目的位置。但是,它們也存在重大區(qū)別。
Flex 布局是軸線布局,只能指定"項(xiàng)目"針對(duì)軸線的位置,可以看作是一維布局。Grid 布局則是將容器劃分成"行"和"列",產(chǎn)生單元格,然后指定"項(xiàng)目所在"的單元格,可以看作是二維布局。Grid 布局遠(yuǎn)比 Flex 布局強(qiáng)大。