html5 비디오의 육각 가장자리를 잘라 내기

Question

html5 비디오 (mp4)을 hexagon edges으로 만드는 방법은 무엇입니까? 내 비디오 크기는 900x600이며 사각형입니다. 대신 육각형으로 만들려고합니다.

누구든지 도움을 얻을 수 있습니까?

Answer 1

내가 알지 못하는 .. 당신은 CSS로 육각 모양을 만들고 위에 붙일 수 있지만, 물론 비디오의 일부를 잘라 버릴 것입니다.

편집 : 이전에 내가 의미 한 바는 CSS에서 완벽한 육각형을 얻지 못해 비디오 나 그와 비슷한 것을 편집 할 수 있다는 것이 었습니다. 어쨌든, 여기에 솔루션입니다 : :before의

만들기 사용 :afterhttps://jsfiddle.net/rckndxbx/

Answer 2

이 모양의 육각형으로 동영상을 보여줍니다

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%); 
} 

간단한 CSS를 사용하여 작업을 수행 할 수 있습니다. 더 잘 이해하기 위해서는 링크를 따라주세요 clipping video 모든 쿼리는 주석 처리해달라고 요청합니다. 최고입니다.