svg path路线的画法_svg如何画路径【svg教程】

使用svg 的path标签画路径

path标签介绍:

path:画路径标签
d:path组成的坐标点
    M = moveto 移动到某一点(开始点)
    L = lineto 画线到某一点
    H = horizontal lineto 水平 画线到某一点
    V = vertical lineto 垂直 画线到某一点
    C = curveto 曲线点
    S = smooth curveto 平滑的曲线点
    Q = quadratic Bezier curve 二次贝塞尔曲线
    T = smooth quadratic Bezier curveto 平滑二次贝塞尔曲线
    A = elliptical Arc 椭圆 弧形
    Z = closepath 关闭路径

fill:填充颜色
stroke:边框颜色
stroke-width:边框宽带
fill-opacity:透明度
stroke-opacity:边框的透明度

svg画路径的简单代码实例:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>svg path 路径的画法</title>
</head>

<body>
    
	<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
	  <path d="M150 0 L75 200 L225 200 Z"  style="fill: #3283D4;"/>
	</svg>
    
</body>

</html> 

path画路线的效果图:

svg path路线的画法_svg如何画路径【svg教程】

来源://作者:admin/更新时间:2013-12-04
相关文章