VML标记与通用属性

来源：互联网发布：java人事管理系统编辑：程序博客网时间：2024/04/30 09:06
1:VML标记VML是通过XML标记来描述矢量图形的，所以必须遵循一定规则，请看下面的几种标记写法1:图形不包含内容，可以直接使用/>号结束<HTML xmlns:v><STYLE>v/:*{behavior:url(#default#VML);}</STYLE><BODY>
<v:oval fillcolor='red' style='width:100;height:150'/>
2:或者使用</名域名:标记名>的形式表示VML图形描述标记的结束<HTML xmlns:v><STYLE>v/:*{behavior:url(#default#VML);}</STYLE><BODY>
<v:oval fillcolor='red' style='width:100;height:150'></v:oval>
2:VML标记通用属性说明和HTML标记的通用属性（如:id、name、class、title、style）等一样，VML标记也有自己的通用属性、支持HTML的通用属性、支持CSS的样式定义。通过这些属性，我们可以修饰VML图形（如线、圆形）的形状、大小、颜色、内容、边框，以及定义鼠标样式、编程用的ID索引、提示标题等等3:VML标记特有的通用属性（非HTML、CSS所有） - 参考表VML特有通用属性使用范例：<HTML xmlns:v><STYLE>v/:*{behavior:url(#default#VML);}</STYLE><BODY>
<v:oval strokeweight='5' strokecolor='red' fillcolor=yellow style='width:100;height:150'></v:oval>
<v:oval stroked=false fillcolor=yellow style='width:100;height:150'/>
属性名默认值值类型/范围用途strokeweight0.75pt=1pxnumber描述图形的边框粗度strokecolorblackcolor描述图形的边框颜色strokedtrueboolean描述图形是否使用边框fillcolorwhitecolor描述图形的背景颜色filledtrueboolean描述图形是否使用背景printtrueboolean描述图形是否允许被打印机打印coordsize1000,1000Vector2D暗示图形与容器空间的大小比例coordorigin0 0Vector2Dcoordinate at top-left corner of elementwrapcoordsnullstringoutline to use for tight text wrapping4:VML标记支持的HTML通用属性 - 参考表HTML通用属性使用范例：<HTML xmlns:v><STYLE>v/:*{behavior:url(#default#VML);}</STYLE><BODY>
<v:oval href='http://www.microsoft.com' title='提示标题' target='_blank' fillcolor=red style='width:100;height:150'/>
属性名默认值值类型/范围用途idnullstring定义元素的标识索引(多用于DHTML编程)classnullclassname定义元素使用的CSS样式类stylenullCSS string描述图形的CSS样式表titlenullstring定义图形的提示标题(鼠标靠近后的帮助提示)hrefnullstring定义图形链接的URL地址target_self_self/_blank/_top定义图形以何种形式打开链接contentEditablefalseboolean描述图形内容是否允许用户编辑dirltrltr/rtl描述图形内容以哪种方向输出disabledfalseboolean描述图形能够响应用户事件触发5:VML标记支持的CSS通用属性 - 参考表其实，VML元素几乎支持所有CSS样式定义，有些HTML元素不支持的像（rotation，旋转样式），VML却支持。由于CSS2样式属性太多，这里不一一写出了，只提及一些常用、好用的样式标记。如需要了解更多有关CSS的资料，请打开LD5、或下载一本由苏小雨编著的CSS手册，内容较专业、全面。CSS通用属性使用范例：<HTML xmlns:v><STYLE>v/:*{behavior:url(#default#VML);}</STYLE><BODY>
<v:oval fillcolor="rgb(255,0,0)" style='position:absolute;left:50;top:150;width:200;height:100;cursor:crosshair;z-index:5000'/>
<v:oval fillcolor="#0000ff" style='position:absolute;left:150;top:250;width:200;height:100;cursor:move;rotation:60;z-index:2000'/>
<v:rect fillcolor="green" style='position:absolute;left:400;top:150;width:200;height:100;cursor:help;rotation:120;zoom:2.5;color:red'>已经被缩放2.5倍</v:rect>
属性名可用值/可用值范围用途width0-9999描述宽度height0-9999描述高度positionstatic absolute fixed relative描述如何定位输出left0-9999描述距离页面位置左top0-9999描述距离页面位置上z-index0-9999描述3D位置cursorauto crosshair hand move help wait text……描述鼠标形状zoom0-99描述缩放比例cliprect(上 右 下 左)描述裁剪对象border0-99 style color描述边框displayblock none inline list-item描述显示或隐藏overflowvisible auto hidden scroll描述滚动条colorcolorstring描述文本内容颜色font-size0-999描述文本内容字号filterxray flipv fliph invert alpha(opacity=num)描述滤镜效果rotation(0-9999)%360描述旋转度flipx y描述反转或颠倒图形………………6:要重视通用属性以上提及的VML通用属性以及范例，不难发现通用属性的重要性，通用属性也是VML元素属性中最重要的属性、最容易使用的属性。不过这里的“通用”你不要理解为“所有的VML元素都支持”，那是不正确的。像今后我们要学的VML标记line(线)，就不支持fillcolor、filled，因为它是“线短”只有边框、没有背景，所以不支持背景描述。“通用”你可以理解为常用的、绝大多数VML图形均可用的“通用属性”。