css实现六边形带图片展示

Question

我的需求就是写一个六边形；里面可以放图片

Answer 1

要实现放置图片的功能的话，可以用三层嵌套div，加overflow隐藏和旋转变换实现
纯CSS六边形

Answer 2

我的想法是弄个正方形里面放图片，然后四个角用四个三角形盖住。 或者弄张png图片，中间是个透明的六边形然后盖住原图

Answer 3

提供个另类思路：w3cPlus上有一篇讲Clip-Path的，开篇Demo就是六边形遮罩图片：

1. 博文地址：打破盒子模式的限制，使用Clip-Path创建响应式图形

2. Demo地址：传送门

Answer 4

提供一种思路
在 Chrome 浏览器下测试。