在矢量图形系统中,图像被描述为一系列几何形状,矢量图形阅读器接受在指定坐标集上绘制形状的指令,而不是接受一系列已经计算好的像素.有人把矢量图形描述为一组绘图指令,而位图则是在特定的位置填充颜色的点....,作为图像,作为CSS背景,作为对象,内联SVG
SVG的坐标系统
视口,文档使用的画布区域称为视口,单位可以em,默认字体大小,ex 字母x的高度,px像素,pt点pc12点cm厘米,mm毫米,in英寸可混用...,没有单位默认为像素
默认坐标是水平坐标向右递增,垂直坐标垂直向下递增
元素svg上的属性viewBox属性,有四个值,分表代表想要叠加在视口上的用户坐标系统的最小x坐标,最小y坐标,宽度和高度
下面一行代码是在..., x,y Min Mid Max
Meet参数适配viewBox视口
参数slice会裁剪图形不适合视口的部分,
如果使用none参数,图像不会被等比例缩放,以使它的用户坐标适合视口....,可能的取值为butt,round,square
属性stroke-linejoin用来指定线段在图形棱角处交叉时的效果,可能的取值有,miter 尖,round圆,bevel平
文档结构:
Svg提倡表现与结构分离