首页写一段将视频放在图片上以这个图片作为网页网页背景的html代码

写一段将视频放在图片上以这个图片作为网页网页背景的html代码

时间: 2024-01-26 13:03:12 浏览: 31

好的，这是一个简单的HTML代码示例，将视频放在图片上并将其作为网页背景： ```html <!DOCTYPE html> <html> <head> <title>Background video on image</title> <style> body { margin: 0; padding: 0; background-image: url("background-image.jpg"); background-size: cover; background-position: center; background-attachment: fixed; } #video-background { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: -1; overflow: hidden; } #video-background video { min-width: 100%; min-height: 100%; width: auto; height: auto; object-fit: cover; } </style> </head> <body> <div id="video-background"> <video autoplay loop muted> <source src="background-video.mp4" type="video/mp4"> <source src="background-video.webm" type="video/webm"> Your browser does not support the video tag. </video> </div> <h1>Hello, World!</h1> </body> </html> ``` 你需要将 `background-image.jpg` 替换为你要使用的背景图片的文件路径，`background-video.mp4` 和 `background-video.webm` 替换为你要使用的视频文件的文件路径。