CHAPTER 04 · PRACTICE WORKSPACE

Box Model、class 與選取器

完成有留白、邊框與圓角的技能卡片

04 Solution 3/3
  1. 01Starter讀懂作品骨架
  2. 02Checkpoint 1加入第一項能力
  3. 03Checkpoint 2累積第二項能力
  4. 04Solution核對完整結果

TASK STATUS

三項任務目前狀態

TASK-01已完成

加入卡片內距

修改檔案:style.css

完成後看見:文字不再貼著卡片邊緣

TASK-02已完成

加入邊框與圓角

修改檔案:style.css

完成後看見:每個技能區塊有清楚卡片邊界

TASK-03已完成

設定卡片外距

修改檔案:style.css

完成後看見:相鄰卡片之間保有一致空隙

WORKSPACE

本階段實作區

已完成 TASK-03;請操作完整作品,逐項核對三項 Task 的可見結果。

HTML

把內容整理成清楚結構。

CSS

替結構安排外觀與空間。

排錯

從畫面線索找出問題來源。

CONTINUE

把完成品帶進本章創作挑戰

三項固定任務都已完成;下一步請改造需求、留下成果證據,不要停在照抄 Solution。

前往本章創作挑戰