使用SVG画一朵小花花~

今天学习到IFE第三十四到第三十六天的任务时，需要使用SVG和Canvas来画图，做SVG的小练习时画了一朵小花花，感觉还挺好看的，使用的都是一些基本的SVG元素，所以就在这里记录一下。

最终效果

先放一下最终效果：

实现方法

首先，svg标签里的内容应该是根据代书写码顺序来呈现的，比如图里花茎被花瓣挡住了一部分，所以花茎部分相应标签要放到花瓣相应标签之前，才会有前后的效果。

花茎就是画一条两次贝塞尔曲线，加宽一下描边就好。代码如下：

<path d="M 100 100 Q 120 150 100 200" stroke="darkolivegreen" stroke-width="5px" stroke-linecap="round" fill="transparent"/> 1

因为默认填充为黑色，所以要设置一下fill为透