赞
踩
一款基于video制作大气全屏的视频播放,视频为背景的文字内容布局。这是一个带有全屏视频背景的登录页。随时可以在项目中使用此登录页。继续添加节,更改视频、内容等,先来看看效果:
一部分关键的代码如下:
- <!DOCTYPE html>
- <html lang="en" >
- <head>
- <meta charset="UTF-8">
- <title>Video Landing Page</title>
-
-
- <link rel="stylesheet" href="css/style.css">
-
- </head>
- <body>
-
- <section class="showcase">
- <div class="video-container">
- <video src="video/video.mov" autoplay muted loop></video>
- </div>
- <div class="content">
- <h1>Shoot For The Stars</h1>
- <h3>全屏视频播放</h3>
- <a href="#about" class="btn">查看更多</a>
- </div>
- </section>
-
- <section id="about">
- <h1>关于我们</h1>
- <p>
- 这是一个带有全屏视频背景的登录页。随时可以在项目中使用此登录页。继续添加节,更改视频、内容等
- </p>
-
- <h2>在社交媒体上关注我</h2>
-
- </section>
-
-
- </body>
- </html>
全部代码:全屏的视频播放video特效
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。