Notes
VML is the abbreviation for the Vector Markup language.
Reference website
MSDN:http://msdn.microsoft.com/workshop/author/vml/shape/introduction.asp
Consortium:Http://www.w3.org/TR/NOTE-VML
First you need to add the following reference to the <HTML> tag
You can ignore the second schema without the extended features that you don't use Office.
Also, you need to register VML and Microsoft Office Extensions in the STYLE element
V\:* {behavior:url (#default #vml);} O\:* {behavior:url (#default #vml);} |
You can ignore the definition of the second style if you do not have extended features that you do not use for office.
Here are a few elements that are commonly used
1.Shape Element
Usage: <v:shape ...></v:shape>
Its Common properties:
FillColor: Image fill Color.
Label Syntax:
<v:element fillcolor= "expression" >
Scripting Syntax:
element.fillcolor= "Expression"
Expression=element.fillcolor
Path: Specifies the path of the painting
Scripting usage:
<v:shape id= "rect01"
Fillcolor= "Red" strokecolor= "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 x E" >
</v:shape>
Description: Defines the coordinates of the initial point of the image with the letter m (MoveTo command), as shown in the example (1,1)
Start drawing lines with the letter L (lowercase l letters, lineto commands), draw first to (1,200), then draw to (200,200), then draw to (200,1)
Turn off lines with the letter x (Close command)
Ends with the letter e (end command)
Note: Each two digits form a coordinate
Title: Prompt text when the mouse moves to the image
Style: The style of the image
filled: Determines whether padding is required in the closed path (true/false)
Strokecolor: The color of the image path
2.Shape elements are valid child elements
TextBox: Define a text box in the image
Usage:
<v:shape>
<v:textbox>VML</v:textbox>
</v:shape>
Textpath: Sets the type path, to use this property, the Path property must be Textpathok to true, and Textpath's on property to be true
Please refer to the reference website for more information!!!
A simple example:
xmlns:o= "Urn:schemas-microsoft-com:office:office" > <HEAD> <STYLE> V\:* {behavior:url (#default #vml);} O\:* {behavior:url (#default #vml);} </STYLE> <TITLE>VML sample</title> </HEAD> <BODY> <v:shape 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, 1 x E" title= "Test" Strokecolor= "Yellow" > <v:fill type= ' gradient ' id= ' fill1 ' color= ' red '/> <v:textbox>VML</v:textbox> </v:shape> </BODY> </HTML> |