前些天无意间看到SVG中一个挺有意思的属性—polygon(多边形),别小看这么一个属性,它可以生成你想要的所有多边形 ,polygon意思并不难理解,主要是你想弄个复杂点/搞怪的多边形的话,还是得花点时间,它的原理就是,通过你给出的坐标点一次连接而成,想要做的精美得花时间弄坐标,下面是本人弄的一个心形图案,花了一个多小时,弄坐标花的太久,刚把坐标弄上去时,全是棱角,然后调了一会,才变得圆滑。
以下是其代码样式:
坐标点全在上面(坐标有点多,效果还不错),下面是效果图
像心形这种关于轴对称的图形相对还好弄,主要是它偏圆,这得稍加处理,
下面这个是普通的八角形,中心对称图形,这类相对简单坐标易得,你也可以尝试其他弄其他不规则图案,完全由个人想法决定。
css样式如下:
图案效果如下
polygon制作的心形图案
最新推荐文章于 2022-11-06 23:27:12 发布