>웹 프론트엔드 >CSS 튜토리얼 >vml_VML 관련 소개

vml_VML 관련 소개

WBOY
WBOY원래의
2016-05-16 12:09:372348검색

VML(Vector Markup Language)
是一个最初由Microsoft开发的XML词表,现在也只有IE5.0以上版本对VML提供支持。使用VML可以在IE中绘制矢量图形,所以有人认为VML就是在IE中实现了画笔的功能。下面介绍一下VML的优点:
基于XML标准
XML是公认拥有无穷生命力的下一代网络标记语言, VML具有先天的优势,它的表示方法简单,易于扩展等等。
支持高质量的矢量图形显示
VML支持广泛的矢量图形特征,它们基于由相连接的直线和曲线描述路径。在VML中使用两个基本的元素:shape和group。这两个元素定义了VML的全部结构;shape描述一个矢量图形元素,而group用来将这些图形结合起来,这样它们可以作为一个整体进行处理。
VML规范包括大量的支持多种不同矢量图形特征的元素。下面是VML的预定义图形元素:
l Shape
l Path
l Line
l Polyline
l Curve
l Rect
l Roundrect
l Oval
l Arc
l Group
由文本构成的图像,并可集成到HTML
由于VML使用简单的文本来表示图像,这样就可用很少的字节来表示比较复杂的图像。VML与HTML兼容,通过在HTML中声明VML命名空间并声明处理函数,就可以和其他HTML元素一样使用VML元素,在客户端浏览器显示图像。VML标记里面可以定义DHTML大部分属性和事件,比如说id, name, title, onmouseover 等等。
支持交互与动画
但VML的功能不只是绘图,他还可以在图形中嵌入文本,并可实现超链,还可通过脚本语言实现一定的动画功能。

 

 

 

 

VML是The Vector Markup Language的缩写。


参考网站
MSDN:http://msdn.microsoft.com/workshop/author/vml/shape/introduction.asp

W3C:http://www.w3.org/TR/NOTE-VML

首先需要在 标签中加上如下引用

xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
...

如果没有您没有用到OFFICE的扩展功能的话,您可以忽略第二个schema。
同时,您需要在STYLE元素中注册VML和Microsoft Office Extensions

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


OFFICE의 확장 기능을 사용하지 않는 경우에는 두 번째 스타일의 정의를 무시해도 됩니다.

일반적으로 사용되는 요소에 대해 이야기해 보겠습니다.

1. Shape 요소
사용법:
공통 속성:
FillColor: 이미지 채우기 색상.
태그 구문:

스크립트 구문:
element.fillcolor="expression"
expression=element.fillcolor

경로: 페인팅 경로 지정
스크립트 사용법:
fillcolor="red" 스트로크컬러="red"
coordorigin = "0 0" coordsize="200 200"
style="position:relative;top:1;left:1;width:20;height:20"
path="m 1,1 l 1,200, 200,200 , 200,1 문자 l(소문자 L 문자, lineto 명령)은 선을 그리기 시작하여 먼저 (1,200)까지 그린 다음 (200,200)까지 그린 다음 (200,1)까지 그립니다.
줄을 닫으려면 문자 x(닫기 명령)
문자 e로 끝(끝 명령)
참고: 두 숫자는 모두 좌표를 형성합니다


제목
: 다음 경우에 프롬프트 텍스트 이미지 위로 마우스 이동
스타일: 이미지의 스타일
채움: 닫힌 경로에 채우기가 필요한지 여부를 결정합니다(True/False)
StrokeColor: 이미지 경로의 색상
2. Shape 요소의 유효한 하위 요소


TextBox
: 정의 이미지의 텍스트 상자
사용법: VML


TextPath
: 텍스트 경로를 설정하고 이 속성을 사용하세요. path 속성의 TextPathOK가 true여야 하고 TextPath의 on 속성이 true여야 합니다.
자세한 안내는 참고사이트를 확인해주세요! ! !

간단한 예:



xmlns:o="urn:schemas-microsoft-com:office:office">


VML Sample


fillcolor="green"
style="position:relative;top:1;left:1;width:200;height:200"
path = "m 1,1 l 1,250, 250,500, 500,500, 500,250, 250, 1 x e"
title="test"
strokeColor="yellow">

VML


v:* { 동작: url(#default#VML);} o:* { 동작: url(#default#VML);}

VML 샘플

fillcolor="green"<🎜>style= "위치:상대;위:1;왼쪽:1;너비:200;높이:200"<🎜>경로 = "m 1,1 l 1,250, 250,500, 500,500, 500,250, 250, 1 x e"<🎜>title= "test"<🎜>StrokeColor="yellow">VML< /v:textbox>
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.