——矢量图
    ——适合大面积的贴图
    ——通常动画较少较简单
    ——使用标签和css画
    ——所有闭合图形，默认是填充并且渲染完成的
    1 画矩形
    ——画线标签是line，带有属性两点坐标
    ——需要使用css绘制到网页，stroke：颜色
    ——矩形标签：rect，属性为起点坐标，宽高；rx/ry 表示圆角
    2 画圆
    ——圆：circle，属性为半径，圆心(cx,xy)
    ——椭圆：ellipse，属性半径(rx,ry)，圆心
    ——折线：polyline，属性为起点，拐点；每个点坐标用空格隔开，点与点之间用逗号隔开
    3 画多边形
    ——多边形：polygon，写法和折线相同，是闭合图形
    ——文本：text
    4 path元素 路径
    ——属性d：M—moveTo；L—lineTo；H—水平方向距离；V—竖直方向；Z—闭合区间(不分大小写)
    ——大写字母 代表绝对位置；小写字母代表相对位置
    5 渐变
    ——先定义defs标签
    ——linearGradient标签：线性渐变，属性为渐变点的坐标
    ——stop标签：属性定义offset 位置；style=”stop-color” 颜色
    ——在需要渐变的图形内添加style=”fill : url(渐变id)”
    6 模糊
    ——在defs标签内定义filter标签
    ——feGaussianBlur标签：高斯模糊。属性in=””
    7 虚线
    ——css：stroke-dasharray：可以把实线变虚线，填数值，依次交替出现
    ——stroke-dashoffset：偏移(黑白块偏移)
    8 viewbox 比例尺
    ——四个参数：起始位置，宽，高
    css属性：
    ——fill:transparent 不填充
    ——stroke-opacity：边框透明度；fill-opacity：填充透明度
    ——stroke-linecap：边框两端样式
    ——stroke-linejoin：交点样式