[SVG] 11. 如何調整 svg 相關元素的外觀

我們所撰寫的 svg，也可以透過 CSS 去調整外觀，那在語法上該如何做到呢？而且也不是所有的 CSS 樣式都可以使用，svg 有部份有它自己專屬的設定方式。

觀念

在針對 svg 去調整外觀樣式的時候，以下幾個觀念需要留意：

• 直接寫在標籤的 style 屬性中。
• 可以寫在 css 樣式表之中
• 並不是所有的 css 都可以使用，例如要改變 text 元素的顏色的話，要使用 fill 來設定，而不是 color。

範例

請看以下範例，來瞭解該如何為 svg 設定樣式：

See the Pen svg 修改樣式 by CarlosStudio (@carlos411) on CodePen.