代码4:SVG画椭圆
<!DOCTYPE html>
<head>
<title>Mrbool - HTML5 Tutorials</title>
<meta charset="utf-8" />
</head>
<body>
<h2>HTML5 SVG Ellipse Example</h2>
<svg id="svgEllipseTutorial" height="150" xmlns=".w3.org/2000/svg">
<ellipse id="myEllipse" cx="120" cy="60" rx="100" ry="50" style="fill:#3F5208;stroke:black;stroke-width:3"/>
</svg>
</body>
</html>
SVG多边形:
我们使用特定标签绘制多边形,points属性用来定义多边形的几个顶点,用左边对来定义,形如 points="10,10 75,150 150,60" ,这里定义了三个顶点(10,10),(75,150),(150,60)。同上面一样,用 style="fill:#63BCF7;stroke:black;stroke-width:3" 定义多边形填充颜色、边框以及边框宽度。
代码5:SVG画多边形
<!DOCTYPE html>
<head>
<title>Mrbool - HTML5 Tutorials</title>
<meta charset="utf-8" />
</head>
<body>
<h2>HTML5 SVG Polygon Example</h2>
<svg id="svgPolygonTutorial" height="200" xmlns=".w3.org/2000/svg">
<polygon id="myPolygon" points="10,10 75,150 150,60" style="fill:#63BCF7;stroke:black;stroke-width:3"/>
</svg>
</body>
</html>