跳轉到

建立 2026-09-14 更新 2026-09-14

入門

先搞清楚 SVG 是什麼、座標怎麼算、怎麼放到網頁上。這三件事沒對,後面的形狀與文字都會對不準。

這個分類有什麼

  • 簡介:SVG 是什麼、最重要的 20%、學習路徑
  • 座標與 viewBox:畫布尺寸、原點、viewBox 與 preserveAspectRatio
  • 嵌入方式:inline、<img>、<object>、背景圖,以及各自能不能上 CSS/JS

官方學習資源

MDN 入門

Getting started 與 Positions 對應本分類兩篇講義。

影音

想先看全貌再讀文章,請到 影音教學。Fireship 的百分秒介紹適合建立直覺,Hunor 的 24 個範例適合跟著寫。