一个ie下的vml和firefox,opera,safari支持的svg的入门示例
1,IE下的vml
<html xmlns:v="urn:schemas-microsoft-com:vml">
<STYLE>
v\:* { Behavior: url(#default#VML) }
</STYLE>
<body>
<v:roundrect strokecolor="black" fillcolor="white" style="position:relative;left:20;top:5;width:100px;height:40px;z-index:9">
<v:shadow on="t" type="single" color="silver" offset="3pt,3pt"></v:shadow>
<v:textbox id="memo" style="font-size:10pt;color:blue;line-height:18px" inset="1,1,1,1">Hello world!<br>Hello VML!</v:textbox>
</v:roundrect>
<v:oval strokecolor="black" fillcolor="white" style="position:relative;left:9;top:20;width:14px;height:10px;z-index:8">
<v:shadow on="t" type="single" color="silver" offset="3pt,3pt"></v:shadow>
</v:oval>
<v:oval strokecolor="black" fillcolor="white" style="position:relative;left:0;top:35;width:10px;height:8px;Z-index:7">
<v:shadow on="t" type="single" color="silver" offset="3pt,3pt"></v:shadow>
</v:oval>
<!--/v:group-->
</body>
2 SVG示例:
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" height="100%">
<defs>
<rect id="rect1" width="200" height="200" fill="red" x="10" y="10" stroke="black" />
<circle id="circle1" r="200" fill="blue" stroke="black" cx="200" cy="200" />
</defs>
</svg>
<div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" height="100%">
<g>
<use xlink:href="#rect1" />
</g>
</svg>
</div>
<br>
<div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" height="100%">
<g>
<use xlink:href="#circle1" />
</g>
</svg>
</div>