如何在网站头部添加视频海报，方法是什么
导读：关于“如何在网站头部添加视频海报，方法是什么”的知识点有一些人不是很理解，对此小编给大家总结了相关内容，文中的内容简单清晰，易于学习与理解，具有一定的参考学习价值，希望能对大家有所帮助，接下来就跟随小编一起学习一下“如何在网站头部添加视频海...
关于“如何在网站头部添加视频海报，方法是什么”的知识点有一些人不是很理解，对此小编给大家总结了相关内容，文中的内容简单清晰，易于学习与理解，具有一定的参考学习价值，希望能对大家有所帮助，接下来就跟随小编一起学习一下“如何在网站头部添加视频海报，方法是什么”吧。本篇文章给大家带来的内容是介绍如何在网站头部添加视频海报？添加视频海报的方法（代码示例） 。有一定的参考价值，有需要的朋友可以参考一下，希望对你们有所帮助。
给网站头部添加视频海报的代码：
!DOCTYPE html>
html>
head>
meta charset="UTF-8">
title>
视频海报/title>
style>
*{
margin: 0;
padding: 0;
}
#banner{
width: 100%;
height: 500px;
background: purple;
overflow: hidden;
position: relative;
}
#banner video{
width: 100%;
position: relative;
opacity: 0.6;
/* 设置透明度 */
}
#banner h2,h4{
position: absolute;
top: 120px;
left: 150px;
width: 100%;
text-align: left;
color: #fff;
line-height: 30px;
}
#banner h2{
top: 80px;
font-size: 40px;
text-decoration: underline;
}
/style>
/head>
body>
div id="banner">
video loop autoplay>
!-- loop循环播放，autoplay自动播放 -->
source src="video/banner.mp4">
/video>
h2>
SLOW DOWN/h2>
h4>
静下来br>
携一缕清风，续一杯清茶 br>
且听风轻云淡/h4>
/div>
/body>
/html>
结果
现在大家对于如何在网站头部添加视频海报，方法是什么的内容应该都清楚了吧，希望大家阅读完这篇文章能有所收获。最后，想要了解更多如何在网站头部添加视频海报，方法是什么的知识，欢迎关注网络，网络将为大家推送更多相关知识点的文章。
声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！
若转载请注明出处： 如何在网站头部添加视频海报，方法是什么
本文地址： https://pptw.com/jishu/654137.html