添加xmlns="http://www.w3.org/2000/svg" version="1.1"
到您的SVG標記。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/html1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us">
<head>
<title>SVG iPhone Test</title>
</head>
<body >
<svg width="500" height="220" xmlns="http://www.w3.org/2000/svg" version="1.1">
<rect x="2" y="2" width="496" height="216" stroke="#000" stroke-width="2px" fill="transparent"></rect>
</svg>
</body>
</html>
通過http://www.invalidpage.com/svg/svgtest.html
被輸送的HTTP MIME類型是 "Content-Type: text/html"
。 HTML inline svg使用MIME類型"Content-Type: text/xml"
您可以通過使用XML結束文檔而不是HTML,因爲它們有done here。
不確定Ipad是否關心Content-Type
但其他瀏覽器。
更新
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
也可以用;這是Ipad svg示例中顯示的內容。當文檔以XML格式而不是HTML格式傳送時,應以<xml version="1.0" standalone="no">
開頭;
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="500" height="220" xmlns="http://www.w3.org/2000/svg" version="1.1">
<rect x="2" y="2" width="496" height="216" stroke="#000" stroke-width="2px" fill="transparent"></rect>
</svg>
其實,事情是這樣的工作原理上除了iPad/iPhone的一切,據我可以告訴。我插入了RaphaelJS,現在它也在iOS上工作。我也嘗試過xmlns和version屬性,結果相同,除了iOS以外的其他地方都可以使用。 – 2010-12-29 16:38:37
它在使用webkit引擎的Chrome中渲染(所以Ipad應該渲染 - 我還沒有):但是目前沒有在firefox 3.6.13中工作......這可能是因爲內容類型是「Content-Type:text/html「...在嚴格的xml規則下,需要定義xmlns。 <!DOCTYPE html>不適用嚴格的xml規則,但是firefox 3.6.13不幸的是仍然不呈現<!DOCTYPE html>內聯svg。 ...通過使用http://code.google.com/chrome/chromeframe/它也將在Internet Explorer中工作 – Wayne 2010-12-29 17:05:26
我知道理論上它應該可以在任何webkit瀏覽器中工作,如果它在一個工作。它只是沒有。我在我的主域名的另一個頁面中切換了所有內容,以測試您呈現的所有不同選項,但都無效。似乎工作的唯一的東西是通過JavaScript後加載生成它。我已經離開原來的頁面,以便它仍然符合原始問題。 – 2011-01-03 17:32:33