我正在尝试让 SVG 图像显示在我的 iPhone(或 iPad)默认浏览器上，但我似乎无法显示甚至只是一个矩形。
示例:http://www.invalidpage.com/svg/svgtest.html
来源:
<!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>
<div>
<svg width="500" height="220">
<rect x="2" y="2" width="496" height="216" stroke="#000" stroke-width="2px" fill="transparent"></rect>
</svg>
</div>
</body>
</html>
最佳答案
添加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 内联 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>
关于iphone - 移动 Safari SVG 问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/4504942/