svg path属性

1.path   M是起点,L是相邻点,后面都是两个值

<path d="M100 50 L200 50 L100 20" stroke="red" fill="none"></path>

2.H是横向绘制,后面跟一个值,默认y轴上的值一样 ,V是垂直绘制 ,后面跟一个值,默认x轴上的值一样

<path d="M100 50L120 70V60" stroke="red" fill="none"></path>

3.Z代表构造一个闭合回路

<path d="M100 50L120 70V60Z" stroke="blue" fill="none"></path>

H代表水平的线条 默认y轴上的值一样

V 代表垂直的线条 默认x轴上的值一样

A 后面跟七个值

 

G 用于将相关元素进行组合

 

 

 

G身上的属性 子元素都会继承 但是g上的属性都必须是显现属性 不是svg元素私有的 比如 g 上的圆心坐标不行 

Text-anchor="middle" 让字体居中

 

 

猜你喜欢

转载自www.cnblogs.com/txf-123/p/10903761.html