svg 与canvas的区别

canvas

           画图  位图

           兼容性：高级浏览器

svg   

     矢量图    兼容性：高级浏览器  

     画图的本质是标签   

     stroke 线的颜色        

     stroke-width 线的宽度        

    注：线宽还是从两边扩展        

    样式可以用    

    属性<*<标签

    标签不区分大小写 

     line 可以写成单标签,也可以不闭合，但是多个但标签一起必须闭合

    配合js

           获取元素没任何问题

            操作属性：不能用.和[]只能用Attribute

矩形：

fill 填充色

rx ry  圆角

svg常用的属性

              stroke  线的颜色

               stroke-width 线宽

               fill    填充色

               fill='none' 去掉填充色

               fill-opacity

              stroke-opacity

端点

            stroke-linecap="square"

            stroke-linecap="round"

           stroke-linecap="butt"  默认值

虚线

           stroke-dasharray="10"

           stroke-dasharray="10,20"

           stroke-dasharray="10,20,30"

运动

          transition:1s all ease