VML是微软1999年推出的基于XML的矢量图形语言,专为IE5–IE8设计,需声明命名空间、引入行为并设兼容模式;支持rect、oval等语义化标签绘图,JS动态创建需注册命名空间;仅IE支持,现代浏览器应迁至SVG或Canvas。

VML(Vector Markup Language)是一种基于 XML 的矢量图形标记语言,由微软在 1999 年随 IE5 推出,本质是“IE 内置的画笔”——它不依赖图片文件,而是用文本标签描述线条、形状、填充等,图形可无限缩放不失真,特别适合旧系统中做地图、统计图、流程图等动态图表。
VML 在旧版 IE 中的基本使用条件
不是所有 IE 都能直接识别 VML,必须满足三个前提:
- 页面声明 VML 命名空间:
- 引入 VML 行为(Behavior):
- 确保文档模式兼容(如 IE5–IE8 标准模式;IE9+ 默认禁用,需强制兼容视图或使用 X-UA-Compatible)
常用 VML 图形标签与写法
VML 标签以 v: 开头,大小写不敏感,支持嵌套和 CSS 样式。基础图形可直接使用语义化标签,比通用 更简洁:
-
—— 绘制带边框的蓝色矩形 -
—— 绘制红色圆形 -
—— 绘制绿色加粗直线 -
—— 绘制折线
动态生成 VML 图形的关键技巧
纯静态 HTML 写法简单,但实际项目常需 JS 动态创建。注意几个易错点:
- 不能用
document.createElement('v:rect')直接创建(IE6–8 不认),应改用document.createElement('或') document.body.innerHTML += '...' - 若用 DOM 方法插入,记得先注册命名空间:
document.namespaces.add('v', 'urn:schemas-microsoft-com:vml'); - 文字显示要用
包裹,并设置style="position:absolute;"和显式宽高,否则内容不可见 - 路径绘制(
)需遵循 VML 路径语法:m=move, l=line, e=end
兼容性与现实提醒
VML 只被 IE5–IE9(含兼容模式)原生支持,Chrome、Firefox、Edge 等现代浏览器完全不识别。2025 年仍需维护旧系统时,可搭配条件注释或 UA 检测做降级处理,比如:
如果目标环境已淘汰 IE,建议迁移到 SVG 或 Canvas 方案——VML 是技术演进中的过渡产物,理解它重在读懂遗留代码,而非新建项目首选。
基本上就这些。










