不能工作tad <use>與數據：image/svg + xml，<svg

我想在我的.htm頁面中插入.svg。但'使用'在'svg'中不起作用。如何做到這一點？不能工作tad <use>與數據：image/svg + xml，<svg

background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' 
xmlns:xlink='http://www.w3.org/1999/xlink' width='180' height='118' 
fill='white'><path d='M90,14 143,108H37z' stroke-width='11' 
stroke='red'/><g id='cr'><path d='M70,68 73,59H90L93,68' stroke-width='2' 
stroke='black'/><path d='M67,70H93V74H67M71,74V81M92,74V81' stroke- 
width='5' stroke='black'/></g><use x='13' y='8' xlink:href='#cr'/><use 
x='26' y='16' xlink:href='#cr'/></svg>")

來源

2017-04-21 Alexander V. Ulyanov

＃字符在url中保留用於片段標識符的開始，它們必須編碼爲％23 –

好的。謝謝。如何使用fill ='＃fff'顏色代替fill ='white'？ –

％23fff，因爲我已經表明 –

這裏「使用」標籤沒有錯。

由於某些原因，URL無法讀取該SVG。

有一種替代方式，它是可讀和可維護的。

從URL拿出你的SVG和創建一個單獨的SVG文件...爲前：test.svg

<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='180' height='118' fill='white'> 

<path d='M90,14 143,108H37z' stroke-width='11' stroke='red'/> 

<g id='cr'> 
<path d='M70,68 73,59H90L93,68' stroke-width='2' stroke='black'/> 
<path d='M67,70H93V74H67M71,74V81M92,74V81' stroke-width='5' stroke='black'/> 
</g> 

<use x='13' y='8' xlink:href='#cr'/> 
<use x='26' y='16' xlink:href='#cr'/> 

</svg>

而在你的CSS。說它簡單，如圖URL SVG文件名稱下面的測試代碼：

<!DOCTYPE html> 
<html> 
<head> 
<style> 
body { 
    background: url("test1.svg") no-repeat fixed center; 
} 
</style> 
</head> 
<body> 
</body> 
</html>

做的這種方式可以幫助你在

維修方便
可重複使用的
可讀性

來源

2017-04-21 17:40:35 Naidu

謝謝。不。它的方法爲頁面添加+1請求。 –

回答

相關問題