Html 六边形溢出中的背景

如何确保六边形允许背景图像溢出

我用以下代码创建了六边形：

---css--

**HTML**

    <div id="eventinfo">
        <div id="hex3" class="hexagon-wrapper">
            <div id="color5" class="hexagon"></div>
        </div>
    </div>

这给了我以下结果：

我当然想去的地方：

---

我怎样才能做到这一点？我毫无头绪，完全不知所措，谷歌在我眼中没有任何有用的东西。

我使用了csstricks文章中的一个例子，它实现了您尝试使用clip path所做的事情

-webkit-clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);

这是全文

-webkit-clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);