HTML如何设置video为不透明背景


当前第2页 返回上一页

先插入如下代码:

1

<video src="../video/2b.mp4" loop="loop" autoplay="autoplay"></video>

  • loop表示循环播放

  • autoplay表示自动播放

css修饰如下:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

<style>

body{

    margin:0;//body外边距设为0;

}

video{

    position: fixed;//视频定位方式设为固定

    right: 0;

    bottom: 0;//视频位置

    min-width: 100%;

    min-height: 100%; //不会因视频尺寸造成页面需要滚动

    width: auto;

    height: auto; //尺寸保持原视频大小

    z-index: -100; //z轴定位,小于0即可

    -webkit-filter: grayscale(20%);//添加灰度蒙版,如果设定为100%则视频显示为黑白

}

</style>

相关学习推荐:html教程

以上就是HTML如何设置video为不透明背景的详细内容,更多文章请关注木庄网络博客

返回前面的内容

相关阅读 >>

Html ins标签怎么用

Html中div与span对比

Html option标签怎么添加两个value?option标签的用法解析

Html的<abbr>标签

详细介绍Html5中的新事件

Html meta标签的作用是什么?Html meta标签常见的属性介绍

Html 基础

Html中如何设置form大小

Html怎么使按钮不可用

Html和js实现简单的计算器

更多相关阅读请进入《Html》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...