VML v: shape, V: округлые элементы не отображаются правильно в IE6, IE7 в строгом режиме - PullRequest
Новая
       18

VML v: shape, V: округлые элементы не отображаются правильно в IE6, IE7 в строгом режиме

0 голосов
/ 14 октября 2011

Кто-нибудь может дать ответ на такой вопрос? Я пытаюсь поместить векторную графику в HTML. На самом деле это не нужно в моем случае, поэтому я, вероятно, сейчас прибегну к простому изображению, но я столкнулся с проблемой, которую не смог решить, стало очень интересно и актуально для будущего определять, что происходит не так. Кстати, VML для меня абсолютно новый.

Я попытался вставить несколько vml-элементов на страницу, и некоторые из них отлично работали (в IE6, IE7), а именно: "овал", "прямоугольник". Но когда я попытался вставить форму или округлить, все пошло не так.

Фактический вопрос: есть ли удовлетворительная поддержка VML в IE6, IE7 или что я делаю не так? Но насколько я изучил свой код, все в нем правильно. Ниже я приведу пример, чтобы каждый мог проверить это в IE-браузере: 

<!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>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title>sample</title>

<style>

  v\:* { behavior: url(#default#VML); display:inline-block}

  #div1 {

    width:400px;

    height:400px;

    background-color:#e4fe56;

  }

</style>

</head>

<body>

  <div id="div1">

    <v:shape style='width:100px;height:100px' fillcolor="red" path="m 0,0 l 30,0,30,30 xe" />

    <v:rect style='width:100pt;height:75pt' fillcolor="blue" strokecolor="red" strokeweight="3.5pt"/>

    <v:roundrect style='width:100pt;height:75pt" arcsize="0.3" fillcolor="yellow"   strokecolor="red" strokeweight="2pt"/>

  </div>

</body>

</html>

Кроме того, я обнаружил, что это происходит только в строгом режиме. Когда DOCTYPE удален или с другими условиями, когда IE работает в режиме quirks, все работает хорошо.

1 Ответ

1 голос
/ 18 января 2012

У вас есть несоответствующие кавычки в вашем атрибуте стиля 

<v:roundrect style='width:100pt;height:75pt"

В вашем доктрине есть пробел: 

/xhtml1  /
...