如何利用CSS写一个六边形?

网友解答: 利用css写一个六边形方法有很多,下面我来说一下我的实现方法,供大家参考;首先我们可以把一个六边形,拆开来看,就是中间一个矩形加左右各一个三角形,如图:这样一拆解,就非常简单

网友解答:

利用css写一个六边形方法有很多,下面我来说一下我的实现方法,供大家参考;

首先我们可以把一个六边形,拆开来看,就是中间一个矩形加左右各一个三角形,如图:

这样一拆解,就非常简单了,我们可以用一个div来写矩形,然后利用伪类before和after来实现左右的三角形;三角形可以用边框border属性来实现就可以了,具体实现,请看下图代码:

效果图:

总结:

以上就是用css写了一个六边形,只要想清思路,实现起来就很简单;

如有疑问,欢迎在评论下方留言讨论;喜欢的记得点赞+关注,为大家提供专业的前端知识

网友解答:

clip-path:polygon(22.5% 0,77.5% 0,77.5% 100%,22.5% 100%,0 50%)

一行就搞定了

标签: