Video-Background/index.html at master · devgl96/Video-Background · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<!DOCTYPE html>
<html lang="en">
    <!--https://www.videvo.net-->
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <link rel="stylesheet" href="style.css">
        <title>Video Background</title>
    </head>
    <body>
        <header class="v-header container">
            <div class="fullscreen-video-wrap">
                <video autoplay loop>
                  <source src="./code.mp4" type="video/mp4">
                </video>
            </div>
            <div class="header-overlay"></div>
            <div class="header-content">
                <h1>Hello Everyone</h1>
                <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Esse rerum vitae in velit cumque doloribus quisquam dignissimos explicabo, magnam aperiam!</p>
                <a href="#" class="btn">Read More</a>
            </div>
        </header>

        <section class="section section-a">
            <div class="container">
                <h1>Section A</h1>
                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Illum quae quaerat soluta vel eveniet, vero quasi nesciunt obcaecati unde omnis exercitationem illo, quo consequuntur blanditiis impedit sit odio perspiciatis consequatur. Alias culpa facere accusamus perspiciatis fuga temporibus, porro tenetur eius quam reiciendis et amet obcaecati laudantium ea? Ab, tempora veritatis.</p>
            </div>
        </section>
        <section class="section section-b">
            <div class="container">
                <h1>Section B</h1>
                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Illum quae quaerat soluta vel eveniet, vero quasi nesciunt obcaecati unde omnis exercitationem illo, quo consequuntur blanditiis impedit sit odio perspiciatis consequatur. Alias culpa facere accusamus perspiciatis fuga temporibus, porro tenetur eius quam reiciendis et amet obcaecati laudantium ea? Ab, tempora veritatis.</p>
            </div>
        </section>
    </body>
</html>