|
有没有办法使用CSS3 border-radius属性来切断我的html5视频元素的角落?
解决方法
创建一个带有圆角和溢出的div容器:hidden。然后将视频放在其中。
[pre]
<style>
.video-mask{
width: 350px;
-webkit-mask-image: -webkit-radial-gradient(circle,white 100%,black 100%);
-webkit-transform: rotate(0.000001deg);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
overflow: hidden;
}
</style>
<div class="video-mask">
<video></video>
</div>
[/pre] |
|