4 
<%@ Page Language="C#" .. %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<html>
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
   <circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="red" />
</svg> 
 </body>
</html>

/*上面的代码不起作用。没有得到任何输出。如果将第二行的 Doctype 替换如下，它可以工作。

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 过渡//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">

任何人都可以帮助我理解关键区别是什么？*/

4

3 回答 3

6

关键的区别在于

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >

导致浏览器使用怪癖模式。IE 在quirks模式下不支持 SVG 。

然而

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

导致浏览器处于几乎标准模式。

您可以将您的 doctype 转换为一种可以非常轻松地在 IE9 中呈现 SVG 的类型，只需添加一个系统标识符，如下所示：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

我不知道这是否适用于 IE10，但如果 IE10 遵循 HTML5 doctype 解析规则，即使是上面的 doctype 也会导致quirks模式，因此可能导致 SVG 无法呈现。

HTML 4.0 在 13 年前的 1999 年被 HTML 4.01 取代为 W3C 推荐，因此您应该使用的绝对最小文档类型是

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

就像您提到的 XHTML doctype 一样，这将导致HTML5 兼容浏览器中的几乎标准模式。但那是为人们从 HTML 3.2 转换他们的网站而设计的。

更好的是确保您的站点在标准模式下工作。您可以通过使用 HTML 4.01 严格的文档类型来做到这一点，例如

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

这是当前的 W3C 建议，但要记住的时间仍然有点长。将浏览器置于标准模式的最短字符串是

<!DOCTYPE HTML>

这就是为什么选择它用于 HTML5 和更高版本的文档的原因。

于 2013-02-08T21:26:20.380 回答
2

标准的 html 5 文档类型是

<!DOCTYPE html>

你应该使用它。

IE 9/10 将只显示html 5 文档和 xhtml 文档的 SVG。您的替代文档类型将内容标记为 xhtml，这就是它起作用的原因。

于 2013-02-08T12:07:06.613 回答
1

两件事情：

  1. 确保您的 Web 服务器使用正确的 mime 类型为您的 SVG 文件提供服务：“image/svg+xml”。我在旧版本的 Lighttpd 上遇到了这个问题。

  2. 您可以通过添加 X-UA-Compatible Meta 标签来覆盖 IE 的呈现模式：

    < meta http-equiv="X-UA-Compatible" content="IE=edge" />

这将强制 IE 进入标准模式，同时保留旧的文档类型。这不是最佳实践，但似乎适用于 IE10。

于 2013-04-22T19:16:48.277 回答