解決VML遭遇IE8和XHTML DOCTYPE時不能運行的問題（轉）

時間 2019-11-10

標籤解決 vml 遭遇 ie8 xhtml doctype 不能運行問題欄目瀏覽器简体版

原文原文鏈接

原文網址：http://blog.csdn.net/cuixiping/article/details/4227283 html

如下代碼在IE運行正常 ui

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
< html xmlns:v="urn:schemas-microsoft-com:vml">
< head><title>VML</title>
< style> v/:* { behavior: url(#default#VML); } </style>
< /head>
< body>
< v:rect id=myrect filled="false" stroked="false" rotation="45"
style="position:relative;width:165px;height:55px;border:none;rotation:45;">
<v:imagedata src="http://www.csdn.net/Images/logo_csdn.gif"/>
< /v:rect>
< /body>
< /html> url

若是將DOCTYPE換成XHTML的（以下）則不能運行： spa

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
< html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
< head><title>VML</title>
< style> v/:* { behavior: url(#default#VML); } </style>
< /head>
< body>
< v:rect id=myrect filled="false" stroked="false" rotation="45"
style="position:relative;width:165px;height:55px;border:none;rotation:45;">
<v:imagedata src="http://www.csdn.net/Images/logo_csdn.gif"/>
< /v:rect>
< /body>
< /html> .net

經多方查證，得知故障緣由爲XHTML環境下v/:*在樣式表語法中是非法的，於是被IE8忽略而致使沒法渲染VML（說明：IE7下的XHTML仍然可以識別v/:*），而以下代碼則能夠正確渲染VML： xml

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
< html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
< head><title>VML</title>
< ?import namespace="v" implementation="#default#VML" ?>
< style> v/:rect,v/:rect,v/:imagedata { display:inline-block } </style>
< /head>
< body>
< v:rect id=myrect filled="false" stroked="false" rotation="45"
style="position:relative;width:165px;height:55px;border:none;rotation:45;">
<v:imagedata src="http://www.csdn.net/Images/logo_csdn.gif"/>
< /v:rect>
< /body>
< /html> htm

祕訣就是： blog

<?import namespace="v" implementation="#default#VML" ?>
< style> v/:rect,v/:rect,v/:imagedata { display:inline-block } </style> ip

（1）經過import來引入命名空間 get

（2）將全部用到的vml元素分開寫入樣式{ display:inline-block }

參考網址：

https://connect.microsoft.com/IE/feedback/ViewFeedback.aspx?FeedbackID=333905