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>
b.专用属性：from 起点坐标；
to 终点坐标
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='width: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;width:100;height:100;"/>
</body>
</html>
b.专用属性：无
c.其他说明：其高宽主要由style中的width和height决定
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;width: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;width: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>
b.专用属性：from 起点
to 终点
control1 曲线的第一个曲度
control2 曲线的第二个曲度
c.其他说明：control1、control2可用都不用、用一个或用两个都用
8.shape(任意形状)
a.示例：
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建任意曲线</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:shape style="width:100;height:100" coordsize="100,100" filled="f" strokecolor="blue" path="m 0,0 l 100,100 e"/>
<v:shape style="width:100;height:100" coordsize="50,50" filled="f"
strokecolor="blue" path="m 0,0 l 0,100,100,100,100,0,0,0 e"/>
<v:shape style="width:100;height:100" coordsize="100,100" filled="f"
strokecolor="blue" path="m 0,0 l 0,100,100,100,100,0,0,0 e"/>
<v:shape style="width:100;height:100" coordsize="100,100" filled="f"
strokecolor="blue" path="m0,0 c130,-90,30,90,150,180 e"/>
<v:shape style="width:100;height:100" coordsize="100,100" filled="f"
strokecolor="blue" path="m0,0 c130,-90,30,90,150,180 x e"/>
</body>
</html>
b.专用属性：path 路径(m 起点、 l 画直线、 c 画曲线、x 曲线自动闭合、 e 结束)
coordsize 比例(实际宽:width*100/coordsize第一个值；实际高:height*100/coordsize第二个值)
type 引用模板的名称
9.shapetype(模板)
a.示例：
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>模板使用示例</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:ShapeType id="m1" coordsize="1000 1000" fillcolor="yellow">
<v:Path v="m0,0 l30,-30,60,0,0,0 e"/>
</v:ShapeType>
<v:Shape style="z-index:1;left:271;width:1000;position:absolute;top:225;height:1000" type="#m1"/>
<v:Shape style="z-index:1;left:371;width:2600;position:absolute;top:225;height:4600" type="#m1"/>
<v:Shape style="z-index:1;left:271;width:1000;position:absolute;top:300;height:1000" type="#m1" fillcolor="red"/>
</body>
</html>
b.其他说明：shapetype是专门用来定义形状摸版的（不可见），而后在由shape标记引用、将模版实例化的按照path子属性值输出多边形（可见）。
10.background(背景)
a.示例：
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>背景示例</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:background fillcolor="white">
<v:fill angle=50 type='gradient' color2="yellow"/>
</v:background>
</body>
</html>
11.group(容器)
a.示例：
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>容器示例</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:group id="group1" style='position:absolute;left:0;top:0;z-index:1;width:100;height:100' coordsize="100,100">
<v:oval style="left:100;top:100;width:50;height:50" fillcolor="white"/>
<v:rect style="left:200;top:100;width:50;height:50" fillcolor="yellow"/>
<v:rect style="left:100;top:200;width:80;height:80" fillcolor="red"/>
<v:arc style="left:200;top:200;width:80;height:80" startangle="360" endangle="167" fillcolor="blue"/>
</v:group>
<v:group id="group2" style='position:absolute;left:100;top:100;z-index:1;width:100;height:100' coordsize="100,100">
<v:oval style="left:100;top:100;width:50;height:50" fillcolor="white"/>
<v:rect style="left:200;top:100;width:50;height:50" fillcolor="yellow"/>
<v:rect style="left:100;top:200;width:80;height:80" fillcolor="red"/>
<v:arc style="left:200;top:200;width:80;height:80" startangle="360" endangle="167" fillcolor="blue"/>
</v:group>
<v:group id="group3" style='position:absolute;left:100;top:100;z-index:1;width:200;height:200' coordsize="100,100">
<v:oval style="left:100;top:100;width:50;height:50" fillcolor="white"/>
<v:rect style="left:200;top:100;width:50;height:50" fillcolor="yellow"/>
<v:rect style="left:100;top:200;width:80;height:80" fillcolor="red"/>
<v:arc style="left:200;top:200;width:80;height:80" startangle="360" endangle="167" fillcolor="blue"/>
</v:group>
</body>
</html>
b.其他说明：当使用group后，容器内图形的left、top、width、height等值都是相对group的值。
五、二级标记
二级标记可以看作是对有限的属性进行扩展，就像CSS和HTML的关系一样，利用它我们可以做出更漂亮的图画出来，如上边background(背景)中就使用了fill二级标记，下边我们再来看下如何利用二级标记画一条带箭头的直线：
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>二级标记示例</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:line style="z-index:5;position:absolute;left:200;top:200" to="0,150" strokecolor="red" strokeweight="10px">
<v:Stroke dashstyle="shortdot" endarrow='classic'/>
</v:line>
</body>
</html>
例子中的stroke即为二级标记，它可以用来设置边框样式，除此之外还有shadow(阴影)、fill(填充)、extrusion(立体3D)、
textbox、imagedata(背景图片)等二级标记。二级标记也有自己的属性，我们只须通过设置这些属性就能画出各种漂亮的图来。二级标记的使用
也非常简单，直接嵌套于图形标签中即可。
分享到：
相关推荐
在"VML 画图 统计图、柱状图、饼图、折线图 Powered by MicroSystem_cn.mht"这个文件中，很可能是提供了一个使用VML实现这些图形的示例，包括具体的代码和展示效果。通过查看这个文件，你可以深入学习如何在不支持...
这篇名为“VML画图API”的博文可能详细介绍了如何使用VML API来在网页中绘制图形。虽然具体的博文内容未给出，但我们可以根据VML的基本概念和常见用途来探讨一些相关的知识点。 1. **VML基本元素**：VML由一系列的...
使用VML画图工具有以下几个关键知识点： 1. **VML基本结构**：VML文档由一系列的XML元素组成，如`<v:shape>`定义形状，`<v:textbox>`定义文本框，`<v:arc>`定义弧形等。每个元素都有相应的属性来控制其样式和行为。...
**在网页中利用VML画图** VML，全称Vector Markup Language，是一种用于在网页上创建矢量图形的标记语言。它允许开发人员在不支持HTML5 Canvas或SVG（Scalable Vector Graphics）的旧版IE浏览器中实现矢量图形的...
vml在线画图用例，含Flashvml2及Flashvml3的用例。 什么是vml? VML相当于IE里面的画笔，能实现你所想要的图形，而且结合脚本，可以让图形产生动态的效果。VML是微软1999年9月附带IE5.0发布的，在我认为， VML其实是...
vml类的js,方便使用vml实现画图 js源代码,可以在任何平台上使用，简单，方便
本“vml网页画图经典教材”可能包含了关于如何使用VML在网页中创建、编辑和显示图形的详细教程。VML的主要优点在于它的矢量特性，这意味着图形可以无限放大而不失真，非常适合创建图表、图标、复杂的图形设计和动态...
在提供的压缩包文件中，“VML极道教程”和“Think in vml”可能是两个资源，分别包含了深入的VML教程和关于理解和使用VML的思考。通过学习这些材料，你可以深入了解VML的工作原理，掌握如何使用VML进行图形绘制和...
在"js+vml画图精彩实例"中，我们可以学习到以下关键知识点： 1. **VML基础**：VML是一种XML方言，用于创建和展示矢量图形，包括线条、形状、文本和图像。了解VML的基本元素，如`<v:shape>`、`<v:line>`、`<v:rect>`...
它可能包含了如何使用VML标签和属性创建图形的例子，例如 `<v:shape>`、`<v:line>` 或 `<v:textbox>` 等。通过查看这个文件，你可以学习到如何在HTML文档中嵌入和控制VML元素。 `VmlDraw.js`：这可能是一个...
vml,vml画图，呵呵，vml报表vml,vml画图，呵呵，vml报表vml,vml画图，呵呵，vml报表vml,vml画图，呵呵，vml报表vml,vml画图，呵呵，vml报表vml,vml画图，呵呵，vml报表
### VML画图技术解析：实现画圆、画线与画矩形操作 #### VML简介 VML（Vector Markup Language）是一种由微软开发并专用于IE浏览器中的矢量图形标记语言。它允许开发者在网页中绘制复杂的矢量图形，如线条、形状、...
利用VML标记语言画图、动画制作，一些相关代码的实例
要使用vml画图基本上这个文档就够了，如果想深入了解vml可以去微软官网
"VML Editor.mht" 是一个单一文件的MHT（MIME HTML）文档，它包含了HTML、CSS和JavaScript代码，可能是一个示例或者教程，展示了如何使用VML来实现一个画图板功能。MHT文件是一种Web档案格式，允许将所有页面元素...
例如，使用`<v:shape>`元素定义图形，用`<v:stroke>`和`<v:fill>`来控制线条和填充，而JavaScript可能用于处理用户输入和更新图形状态。 `blad.htm`可能是示例或模板文件，展示了VML可以创建的各种图形。这可能包括...
vml.htm（vml功能页面，已修改，默认加载了一张图片，在此基础上修改。然后点保存异步保存新生成的图片页面代码） vml_all.htm （完整的vml功能页面） DoAjax.aspx （服务器端接收异步传输来的HTML代码，可以保存...
画图和统计图是VML的常见应用场景。例如，开发者可以利用VML创建各种类型的图表，如条形图、饼图、线图等，这些图表可用于数据可视化，帮助用户更好地理解和分析信息。同时，由于VML是基于XML的，所以数据可以直接...
在本文中，我们将深入探讨Vml画板工具的特点、使用方法以及它在IT行业中的应用。 Vml，全称为Vector Markup Language，是一种用于描述二维矢量图形的语言，它是微软在XML基础上开发的，主要用于Web页面上创建图形。...