笔记 - Grid布局

Grid

.container {
  display: grid | inline-grid;
}

row column

.container {
grid-template-columns: 30px 30% auto;
grid-template-row: 30px 30% auto;
}

start end

/* 控制开始位置和结束位置 */
.sub-item {
grid-column-start: 1;
grid-column-end: 2;
}

grid-template-areas

利用标签直接划分区域

你可能感兴趣的:(笔记 - Grid布局)