IE, непрямоугольные блоки и тени
Что я хочу сказать по поводу статьи «Хитрая тень» в блоге Олега Мохова?
<html>
<head>
<xml:namespace ns="urn:schemas-microsoft-com:vml" prefix="v"/>
<style type="text/css">
.vml {
behavior: url(#default#VML);
-ms-behavior: url(#default#VML);
font: 12px Tahoma, sans-serif;
}
#bar1 {
width: 400px;
height: 60px;
color: white;
padding: 12px;
display: block;
}
#bar2 {
width: 20px;
height: 22px;
padding: 12px;
color: white;
position:absolute;
}
</style>
</head>
<body>
<v:roundrect class="vml" id="bar1" fillcolor="navy" strokecolor="navy" strokeweight="1px" arcsize="0.1">
Привет, ребята из W3C! Отсталый Internet Explorer уже много-много лет умеет смешивать векторный язык и
HTML, а в 2010 году не все продвинутые браузеры так умеют.
<v:shadow class="vml" on="true" opacity="0.3" color="navy" offset="7px,5px" />
</v:roundrect>
<v:shape class="vml" id="bar2"
fillcolor="red" strokecolor="red"
coordorigin="0 0" coordsize="200 200"
path="m 1,1 l 800,1, 800,400, 1800,400, 1800,1500, 1,1500, x e">
<v:shadow class="vml" on="true" opacity="0.3" color="red" offset="7px,5px" />
<p>Привет<br />ещё раз!</p>
<p>Вы знаете, уже Internet Explorer 5.0 умеет делать непрямоугольные блоки.</p>
<p>Причём, делает это непринуждённо.</p>
</v:shape>
</body>
</html>Добавлено позднее: в комментариях мне подсказывают, что в IE8/9 надо либо включать режим эмуляции, либо использовать «-ms-behavior» и позиционировать элементы абсолютно.
11 июня 2010 19:27
blog.ad.by (blog.ad.by)
Точнее умел. Уже не умеет - это демо не работает в IE8.11 июня 2010, 20:43