google-chrome - html5视频上的圆 Angular

标签 google-chrome webkit html5-video css

有没有一种方法可以使用 CSS3 border-radius 属性切断我的 html5 视频元素的 Angular ?

查看 this example .它不起作用。

最佳答案

创建一个带有圆 Angular 和 overflow:hidden 的 div 容器。然后将视频放入其中。

<style>
.video-mask{
    width: 350px;
    border-radius: 10px; 
    overflow: hidden; 
}
</style>


<div class="video-mask">
    <video></video>
</div>

关于google-chrome - html5视频上的圆 Angular ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24116918/

相关文章:

firefox - 如何使用开发者工具切换到以前版本的 mozilla?

ruby-on-rails - Chrome 多次发送请求

google-chrome - 为什么 "-webkit-transform-style: preserve-3d;"会让一些div消失?

html - iOS Safari 在播放前下载整个 MP4 视频?

css - 带封面图片的全屏背景 HTML5 视频

video - 局域网上的低延迟 html5 视频

javascript - 将参数传递给 jquery 回调,但也可以在外部使用回调

javascript - 显示本地存储变量

Android inline-block 元素无法识别的字符问题

java - 多个平台上 Java 应用程序中的 WebKit 浏览器