SVG不会在IE 10中使用Doctype HTML 4进行渲染

时间:2013-02-08 11:56:48

标签: xhtml svg doctype internet-explorer-10 html4

<%@ 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替换为第二行,则可以使用。

&LT; !DOCTYPE html PUBLIC“ - // W3C // DTD XHTML 1.0 Transitional // EN”“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”&gt;

任何人都可以帮助我理解关键区别吗? * /

3 个答案:

答案 0 :(得分:6)

关键区别在于

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

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

,而

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

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

您可以将文档类型转换为非常容易在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也会导致怪异模式,因此可能导致SVG不能渲染。

HTML 4.01在十三年前的1999年被HTML 4.01替换为W3C推荐,所以你应该使用的绝对最小文档类型是

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

这将在HTML5兼容的浏览器中导致几乎标准模式,就像您提到的XHTML文档类型一样。但这是为了让人们从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及更高版本文档中使用的原因。

答案 1 :(得分:2)

标准的html 5 doctype是

<!DOCTYPE html>

你应该使用它。

IE 9/10只会显示html 5 documents和xhtml文档的SVG。您的替代doctype将内容标记为xhtml,这就是为什么它可以工作。

答案 2 :(得分:1)

两件事:

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

  2. 您可以通过添加X-UA兼容元标记来覆盖IE的渲染模式:

    &LT; meta http-equiv =“X-UA-Compatible”content =“IE = edge”/&gt;

  3. 这会强制IE进入标准模式,同时保留较旧的doctype。这不是最佳做法,但似乎在IE10中有效。