`
zhyiwww
  • 浏览: 86632 次
最近访客 更多访客>>
文章分类
社区版块
存档分类
最新评论

VML中path属性的理解

阅读更多

<!----> <o:p> </o:p>

VML path 属性的理解

VML ,shape 中最主要的属性是 Path ,它是个功能强大的画笔,语法很简单,由几个字母组成,下面详细讲述: <o:p> </o:p>

m x,y :MoveTo 把画笔移动到 (x,y)
l x,y:LineTo
从当前点到(x,y)画一条线;可以给连续的几个点,VML会连续画出来直到遇到 x 命令。
x:Close
结束一条线;
e:End
结束画图<o:p>

我们来看一个例子: <o:p> </o:p>

<HTML xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office"><o:p>

       <HEAD><o:p>

              <STYLE><o:p>

v\:* { behavior: url(#default#VML);} <o:p>

o\:* { behavior: url(#default#VML);}<o:p>

</STYLE><o:p>

              <TITLE>VML Sample</TITLE><o:p>

       </HEAD><o:p>

       <BODY><o:p>

              <v:shape fillcolor="green" <o:p>

                     style="position:relative;top:1;left:1;width:200;height:200" <o:p>

                     path="m 1,<!----> 1,250, 250,500, 500,500, 500,250, 250, 1 x e" <o:p>

                     title="vml demo - draw  by zhangyi " <o:p>

                     strokeColor="yellow"><o:p>

                     <o:p> </o:p>

                     <v:fill type="gradient" id="fill1" color="red" />                  <o:p>

       <o:p> </o:p>

              </v:shape><o:p>

       </BODY><o:p>

</HTML><o:p>

结果如下图: <o:p> </o:p>

<!----> vml-draw.JPG <o:p> </o:p>

我们把 path 部分单独分开来看: <o:p> </o:p>

path="<o:p>

m 1,1<o:p>

l 1,250, 250,500, 500,500, 500,250, 250, 1 <o:p>

x <o:p>

e"<o:p>

正好可以何上面的说明相对应。

经过四步:

1)        画笔移动到( 1 1 )点, m 表示移动画笔,但是没有画的操作

2)        画线,从第一个坐标开始,( 1 1 )—〉( 1 250 )—〉……—〉( 250 1 ),按点顺次画点。

3)        X, 表示画线结束

4)        E 表示画图的结束

<o:p> </o:p>



zhyiwww 2006-11-01 17:11 发表评论
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics