HTML5-SVG-矩形圆 椭圆 直线 多边形 多线 

1 <svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="500" width="500">
2     <rect width="300" height="100" style="fill:rgba(255,0,0,0.5);stroke-width:1;stroke:rgb(0,0,0)" />
3     <circle cx="60" cy="160" r="40" stroke="black" stroke-width="4" fill="red" />
4     <ellipse cx="200" cy="160" rx="60" ry="30" style="fill:purple" />
5     <line x1="100" y1="120" x2="150" y2="200" style="stroke:rgb(255,0,0);stroke-width:2" />
6     <polygon points="400,10 340,180 490,60 310,60 460,180" style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;" />
7 </svg>

补充：<polyline points="20,20 30,30 40,20" style="fill:none;stroke:black;stroke-width:3" /> 连续多线

 

posted @ 2016-06-16 10:06  skyhap  阅读(413)  评论(0)  编辑  收藏  举报