您可以使用 CSS 設定 SVG 背景圖片的樣式嗎？

透過CSS 設定SVG 背景圖像的樣式

當用作背景圖像時，您可以使用設定為相同的CSS 檔案來設定SVG 樣式嗎

雖然您可以成功定位、縮放和剪輯SVG 圖像（單獨或作為精靈），但在將其指定為背景圖像的同一個CSS 文件中設置SVG 樣式是不可行的。

考慮以下偽CSS程式碼，其目的是根據其父元素的類別來改變形狀的顏色：

element1 {
    background-image(icon.svg);
}

element1.black .svg-pathclass {
    fill: #000000;
}

element1.white .svg-pathclass {
    fill: #ffffff;
}

這種方法假設SVG包含帶有「svg-pathclass」的路徑" class，是行不通的。

原因在於SVG 和CSS 的本質。SVG 是一個獨立的文檔，可以在資料URI 中準備或從外部引用。一旦在另一個文件中用作背景影像，它就成為不可透過CSS 修改的不可變影像。

以上是您可以使用 CSS 設定 SVG 背景圖片的樣式嗎？的詳細內容。更多資訊請關注PHP中文網其他相關文章！