css3实现六边形边框的实例代码

a33326 15 0 PDF 2020-11-26 15:11:14

最外层boxF旋转120度、第二层boxS旋转-60度、第三层boxT再旋转-60度,此时刚好回正,然后把图片就放在第3层的div背景中。因为前两层div中没有东西,纯粹就是用来旋转得到6边形的,所以对1,2层div设置 visibility: hidden ; 而第3层div是放图片的,需要显示出来,因此设置 visibility: visible; 经过旋转肯定有超出的部分,因此对3个div都设置 overflow:hidden; 经过旋转和对超出部分的隐藏我们就可以得到我们想要的6边形了。 注意: 1. 如果不对第3层div设置 visibility: visible; 那它默认就会继

用户评论
请输入评论内容
评分:
暂无评论