Question

我想弄清楚的是如何制作html5视频(mp4)来hexagon edges。我的视频尺寸是900x600，它是一个正方形，我试着把它变成六边形。

任何人都可以提供帮助吗？

Answer 1

你可以使用简单的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 对于任何查询评论它。一切顺利。

Answer 2

不是我知道的..你可以在css中制作六边形并将其粘贴在顶部，但这当然会切断你的一些视频。

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

利用:before和:after https://jsfiddle.net/rckndxbx/

六角形切割html5视频边缘

2 个答案: