MP4 video视频背景色变成透明

2019-05-17103次阅读css3

在Web开发的时候,有些交互特效比较复杂,需要使用视频实现,但是视频的背景色做不到是透明的,导致设计师在制作视频的时候必须跟背景融合在一起。

CSS mix-blend-mode混合模式中有一种混合模式名为滤色,单词是screen,其有一个很有意思的特性表现,那就是黑色和其它元素进行混合的时候表现为透明。

于是我们要实现一个视频背景色透明的效果就很简单,只要把我们的视频背景色设置为黑色,同时设置如下CSS即可:

 

video {
    mix-blend-mode: screen;
}

 

上一篇: HTML中Table表格元素完整指南  下一篇: chrome浏览器控制台显示shadow DOM  

MP4 video视频背景色变成透明相关文章