入門
先搞清楚 SVG 是什麼、座標怎麼算、怎麼放到網頁上。這三件事沒對,後面的形狀與文字都會對不準。
這個分類有什麼
- 簡介:SVG 是什麼、最重要的 20%、學習路徑
- 座標與 viewBox:畫布尺寸、原點、
viewBox與preserveAspectRatio - 嵌入方式:inline、
<img>、<object>、背景圖,以及各自能不能上 CSS/JS
官方學習資源
MDN 入門
Getting started 與 Positions 對應本分類兩篇講義。
影音
想先看全貌再讀文章,請到 影音教學。Fireship 的百分秒介紹適合建立直覺,Hunor 的 24 個範例適合跟著寫。