VML系列教程.ppt
上传人:sy****28 上传时间:2024-09-14 格式:PPT 页数:24 大小:134KB 金币:16 举报 版权申诉
预览加载中,请您耐心等待几秒...

VML系列教程.ppt

VML系列教程.ppt

预览

免费试读已结束,剩余 14 页请下载文档后查看

16 金币

下载此文档

如果您无法下载资料,请参考说明:

1、部分资料下载需要金币,请确保您的账户上有足够的金币

2、已购买过的文档,再次下载不重复扣费

3、资料包下载后请先用软件解压,在使用对应软件打开

VML系列教程Vml:系列教程之一(vml入门基础)xmlns全称就是XMLNameSpace也就是命名空间。Behavior(行为)也是IE5.0新推出的东西,它的功能非常强大,结合样式表,可以给任何HTML对象增加行为(新的属性、方法、事件),而在这里,它的用处是把命名空间“v”和系统预定义的行为VML连接。这样定义以后,你就可以使用下面的标记了,和普通的HTML标记有所区别,每个标记都增加了一个命名空间:<v:shape></v:shape>和其他HTML元素一样,VML标记里面可以定义DHTML大部分属性和事件,比如说id,name,title,onmouseover等等。在写法上VML比较灵活,很多属性既可以写在标记里面,又可以独立出一个新的标记来表示:<v:shapeid=shape1name=shape1onmouseover="alert(this.id)"StrokeColor=redPath="m0,0l10,10xe"></v:shape>等同于下面的写法:<v:shapeid=shape1name=shape1onmouseover="alert(this.id)"><v:StrokeStrokeColor=red/><v:Pathv="m0,0l10,10xe"/></v:shape>当然不是所有的属性都可以写成独立的标记,常用的比如说上面的Stroke(按我的理解可以翻译成线性),Path,Shadow,Fill(填充)等,VML这样的方式可以理解为shape的属性分类,使属性更直观。Shape对象派生出来的一些对象,更加直接的图象,比如说Rect(矩形),RoundRect(圆边的矩形),Oval(圆),Line(线),PolyLine(不规则折线),Image(图形文件)等等,以后将对这些对象细细描述。Vml:系列教程之二(Shape与vml坐标系)在解决实际问题的时候,我发现,IE会自动把可见的VML图象放在相对的(0,0)位置,意思是说,上面两张图如果没有增加两个辅助的坐标,在IE上显示出来是并列的两个正方形。shape中最主要的属性是Path,它是个功能强大的画笔,语法很简单,由几个字母组成,下面详细讲述:mx,y:MoveTo把画笔移动到(x,y);lx,y:LineTo从当前点到(x,y)画一条线;可以给连续的几个点,VML会连续画出来直到遇到x命令。x:Close结束一条线;e:End结束画图shape的其他常用属性:FillColor:填充颜色,使用HTML中规定的颜色;例如:fillcolor=redFilled:是否要填充图形,如果图形不是封闭的,也会自动封闭图形进行填充。当Filled="true"(默认),fillcolor才有效果;StrokeColor:线的颜色;StrokeWeight:线的宽度;Title:当鼠标移动到该图形上的时候,显示的文字,和HTML里面的alt、tilte一样;Type:指定该图形属于那个ShapeType,ShapeType可以为VML制定模版,将在以后加以描述;前面的这些属性,FillColor、Filled可以在<v:Fill/>中使用,StrokeColor、StrokeWeight可以在<v:Stroke/>中使用。也可以在Shape或者继承Shape的对象中使用它。Vml:系列教程之三(Line,Polyline(线)对象)Dot:Dash:LongDash:DashDot:LongDashDot:LongDashDotDot:在画坐标的时候,需要箭头,VML已经定义好了箭头,在Stroke体现:EndArrow和StartArrow属性,一个是线开始的时候有箭头,另一个是线结束的时候有箭头。箭头的样式也有不少:<v:linestyle="position:relative"from="0,0"to="100,0"><v:strokeEndArrow="Classic"/></v:line>EndArrow="Block":EndArrow="Classic":EndArrow="Diamond":StartArrow="Oval":StartArrow="Open":PolyLine是Line的变形,是不规则的连续的线。它有个特殊的属性Points,用来设置每个点的坐标。例如:<v:PolyLinefilled="false"Points="0,00,10020,150200,100"style="position:relative"/>一样可以设置它的线的样式和类型以及箭头(IE5.0中,PolyLine不支持Arrow)<v:PolyLinefilled="false"Points=