html5视频上的六边形切割边缘

Question

我想弄清楚的是如何使html5视频(mp4)拥有hexagon edges。我的视频尺寸是900x600，它是一个正方形，我尝试将它改为六角形。

任何人都可以帮忙吗？

Answer 1

不是我所知道的..你可以在css中制作一个六角形并将它粘在上面，但是这当然会切断你的一些视频。

编辑：我以前的意思是，他可以编辑视频或类似的东西，因为你不会在CSS中获得完美的六边形。总之，这里是您的解决方案：

利用的:before和:afterhttps://jsfiddle.net/rckndxbx/

Answer 2

您可以通过使用简单的CSS

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

这将显示您的视频作为六角形做到这一点。 了解它更好遵循链接clipping video 对于任何查询评论它。 一切顺利。