svg相关

<svg xmlns="http://www.w3.org/2000/svg" width="600" height="600">
<!-- x1,y1 起点位置 x2,y2终点位置  stroke 边框的颜色 -->

    <!-- <line x1="50" x2="100" y1="30" y2="100" style="stroke:red" /> -->

    <!-- <rect width="100" height="50" style="fill:pink;stroke:red;stroke-width:10;" x="20" y="20" /> -->

     <!-- 圆 -->
    <!-- <circle cx="100"  cy="100" r="40" style="fill:red;"/> -->

    <!-- cx cy 坐标  rx横向半径 ry纵向半径 -->
    <!-- <ellipse cx="300" cy="100" rx="150" ry="100" style="stroke:red;fill:pink"/> -->

    <!-- 多边形 polygon会闭合 -->
    <!-- <polygon points="0 0, 100 100,150 50,250,150,300,50"  style="stroke:red"/> -->

    <!-- polyline不会闭合 -->
    <!-- <polyline points="10 100, 10 300,500 300" style="stroke:red;fill:none"/> -->

    <!-- <polygon points="20 50, 40 50, 20 100,40,100" style="stroke:red;fill:none" /> -->

    <!-- path可绘制矩形 圆形和各种多边形 -->
   <!-- <path d="M 10 10 L 100 10 L 100 100 L 10 100 L10 10" style="stroke:red" /> -->

   <!-- i表示相对于当前的位置 -->
   <!-- <path d="M 10 10 l 90 0 l 0 90 l -90 0 l 0 -90" style="stroke:red" /> -->

   <!-- Z表示闭合 -->
   <!-- <path d="M 10 10 l 90 0 l 0 90 l -90 0 Z" style="stroke:red" /> -->

   <!-- h表示水平线 v表示水平线 -->
   <path d="M 10 10 H90 V100 H-90 " style="stroke:red" />
</svg>