html video播放小尺寸时背景色

html-css021

html video播放小尺寸时背景色,第1张

题主是否想询问“html,video播放小尺寸时背景色怎么设置”?

1、需要准备一个小尺寸视频。

2、引入并播放视频,需要用到了html,video标签,然后在source里面写视频的路径,autoplay用来使其自动播放,muted用来使其静音,loop为循环播放。

3、调节视频,使其适应屏幕,加入背景色代码position:fixed即可。

1. 在div中写一个video标签

2.上述div 设置postion为relative

3.在写另一个div设置postion为absolute,然后自己调整left 跟top就行了

大概原理就是将视频的堆叠顺序即z-index设置小一点,可以设置为负值,然后将视频position设为fixed,宽高都设为100%即可,大概代码如下:

video{

position: fixed

right: 0px

bottom: 0px

min-width: 100%

min-height: 100%

height: auto

width: auto

/*加滤镜*/

/*filter: blur(15px)//背景模糊设置 */

/*-webkit-filter: grayscale(100%)*/

/*filter:grayscale(100%)//背景灰度设置*/

z-index:-11

}