技术分享帖教你如何利用CSS写一个六边形？

众所周知，一般情况下div所表现出来的形态是一个矩形，如果给它添加border-radius属性，可以让它成为一个圆角矩形或者是圆形，但是如果希望div表现出更多的形态来呢？

那么我们就来讲讲如何用CSS来写一个六边形。

大家首先来看一下，一个六边形，拆解开来的话，就是一个矩形加左右两个三角形。

 

 

 

 

三角形的话很好写，用边框border属性就可以实现。

当我们给一个div非常粗的边框，但是宽度和高度分别都设置为0的时候，我就会得到如下的图形。

 

 

 

 

 

 

 

 

那么我们只要把其中一条边框给删除，另外两条边框变成透明，这样就能得到一个三角形。