使用Vml 可以在IE中绘制矢量图形, 有人认为Vml就是在IE中实现了画笔的功能.只有IE5.0以上提供对Vml的支持
注:在画图之前必须先去掉page的
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
否则会影响样式
1.line(直线)
a.示例：
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一条从(0,0)到(200,200)的红色的边框为2px的直线</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:line strokecolor="red" strokeweight="2" style="z-index:5;position:absolute;left:233;top:150" from="0,0" to="200,200"/>
</body>
</html>
2.Oval(圆)
a.示例：
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一个宽400高400边框为红色填充为绿色的圆</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:Oval strokecolor='red' fillcolor='green' style='400;height:400'/>
</body>
</html>b.专用属性：无
c.其他说明：其高宽主要由style中的width和height决定
3.rect(矩形)
a.示例：
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一个宽100高100的矩形</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:rect style="position:absolute;z-index:1;left:320px;top:150px;100;height:100;"/>
</body>
</html>
4.roundrect(圆角矩形)
a.示例：
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一个圆角矩形</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:roundrect style="position:absolute;z-index:1;left:220;100;top:100;height:100" fillcolor="red" strokecolor="red" strokeweight="1px" arcsize="0.15"/>
</body>
</html>
b.专用属性：arcsize 描述圆矩形四角的弧度值，0-0.5，默认值0.05
c.其他说明：其高宽主要由style中的width和height决定
5.arc(圆弧)
a.示例：
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一个圆弧</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:arc style="z-index:1;left:110;100;position:absolute;top:10;height:100" startangle="-180" endangle="0"/>
</body>
</html>
b.专用属性：startangle 圆弧的起点缺口，取值范围-360-360，默认值-180；
endangle 圆弧的终点缺口，取值范围-360-360，默认值null(0)
c.其他说明：其高宽主要由style中的width和height决定
6.polyline(多边形)
a.示例：
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一个多边形</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:polyline style="z-index:1;left:71;position:absolute;top:225" points="0,0,30,-40,100,100,0,0" filled="t" fillcolor="white"/>
</body>
</html>
b.专用属性：points 各折点坐标，上例表示(0,0)、(30,-40)、(100,100)、(0,0)四个点
7.curve(曲线)
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一条曲线</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:curve style="z-index:1;left:100;position:absolute;top:300" from="0px,0px" to="150px,0px" filled='f' control1="75,150" control2="75,-150"/>
</body>
</html>