Starter 要做什麼
先看見缺口,再完成一個小修改。
本主題檔案:files/style.css
定位:先數直接 Grid items,再讀 grid-template-rows 與 grid-auto-rows。
Starter · code-edit
先看見缺口,再完成一個小修改。
先看見缺口,再完成一個小修改。
本主題檔案:files/style.css
定位:先數直接 Grid items,再讀 grid-template-rows 與 grid-auto-rows。
頁面不會替你修改檔案;請在實作檔完成後重新整理確認。
grid-template-columns 有兩欄、grid-template-rows 有一列,DOM 放入三個 items,grid-auto-rows:auto。
runtime 的 grid-auto-rows 由 auto 變 56px;DOM 有 3 items,因此第三項位於模板外生成的 implicit row。
.grid{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:3rem;grid-auto-rows:3.5rem}只在本階段資料夾內操作,避免改到其他章節。
index.htmlstyle.css證據:runtime before=auto、after=56px、property=grid-auto-rows;DOM item count=3,模板容量第一列只有2項
前往 Checkpoint →