Scribd Logo
Upload

Welcome to Scribd!

  • 17 views

    Class Web HTML CREATE WEBSITE

    Uploaded by

    Market Pub
    This document contains the HTML and CSS code for a blog website. It includes styling for page elements like headings, paragraphs, links and a navigation overlay. When an "open" link is clicked, the overlay becomes visible with navigation options like About, Services etc. Clicking the close button or outside the overlay hides it again. A background video and image are also included.

    Copyright:

    © All Rights Reserved
    Download as TXT, PDF, TXT or read online from Scribd
    Flag for inappropriate content

    You might also like

    Class Web HTML CREATE WEBSITE

    Uploaded by

    Market Pub
    17 views3 pages
    This document contains the HTML and CSS code for a blog website. It includes styling for page elements like headings, paragraphs, links and a navigation overlay. When an "open" link is clicked, the overlay becomes visible with navigation options like About, Services etc. Clicking the close button or outside the overlay hides it again. A background video and image are also included.

    Original Description:

    HTML how to write a simple website for free. Basic: html css simple templage

    Copyright

    © © All Rights Reserved

    Available Formats

    TXT, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    This document contains the HTML and CSS code for a blog website. It includes styling for page elements like headings, paragraphs, links and a navigation overlay. When an "open" link is clicked, the overlay becomes visible with navigation options like About, Services etc. Clicking the close button or outside the overlay hides it again. A background video and image are also included.

    Copyright:

    © All Rights Reserved
    Download as TXT, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as txt, pdf, or txt
    17 views3 pages

    Class Web HTML CREATE WEBSITE

    Uploaded by

    Market Pub
    This document contains the HTML and CSS code for a blog website. It includes styling for page elements like headings, paragraphs, links and a navigation overlay. When an "open" link is clicked, the overlay becomes visible with navigation options like About, Services etc. Clicking the close button or outside the overlay hides it again. A background video and image are also included.

    Copyright:

    © All Rights Reserved
    Download as TXT, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as txt, pdf, or txt
    of 3

    <!

    DOCTYPE html>
    <html>
    <head>
    <title>BLOG</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <style>
    .body {
    font-family: 'Lato', sans-serif;
    bg: url("Sergine.mp4");
    }
    .h1{
    background-color: transparent;
    height: 100%;
    width: 100%;
    display: none;
    position: fixed;
    top: 2;
    left: 100;
    margin-top: 10px;
    margin-left: 134px;
    margin-right: 730px;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0, 0.9);
    }
    .h2{
    background-color: transparent;
    height: 100%;
    width: 100%;
    display: none;
    position: fixed;
    top: 2;
    left: 100;
    margin-top: 0px;
    margin-left: 14px;
    margin-right: 30px;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0, 0.9);
    }
    .p{
    background-color: transparent;
    height: 100%;
    width: 100%;
    display: none;
    position: fixed;
    top: 10;
    left: 10;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0, 0.9);
    }
    .a{
    background-color: transparent;
    height: 100%;
    width: 100%;
    display: none;
    position: fixed;
    top: 0;
    left: 10;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0, 0.9);
    }
    video-bg{
    background-video: url("Sergine.mp4");
    display: block;
    position: fixed;
    top: 0;
    }
    .overlay {
    height: 100%;
    width: 100%;
    display: none;
    position: fixed;
    z-index: 1;
    top: 60;
    left: 0;
    margin-top: 10px;
    margin-left: 20px;
    margin-right: 5px;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0, 0.9);
    }
    .overlay-content {
    position: relative;
    top: 25%;
    width: 100%;
    text-align: center;
    margin-top: 30px;
    }

    .overlay a {
    padding: 8px;
    text-decoration: none;
    font-size: 36px;
    color: #818181;
    display: block;
    transition: 0.3s;
    }

    .overlay a:hover, .overlay a:focus {


    color: #f1f1f1;
    }

    .overlay .closebtn {
    position: absolute;
    top: 20px;
    right: 45px;
    font-size: 60px;
    }

    @media screen and (max-height: 450px) {


    .overlay a {font-size: 20px}
    .overlay .closebtn {
    font-size: 40px;
    top: 15px;
    right: 35px;
    }
    }
    body { margin: 0; }
    background-color: #EEE8AA;
    section {
    box-sizing: border-box;
    height: 100vh;
    text-align: center;
    padding: 2vw;
    font-size: 6vw;
    }
    </style>
    </head>
    <body>
    <div id="myNav" class="overlay">
    <a href="javascript:void(0)" class="closebtn" onclick="closeNav()">&times;</a>
    <div class="overlay-content">
    <a href="#">About</a>
    <a href="#">Services</a>
    <a href="#">Facebook</a>
    <a href="#">Contact</a>
    </div>
    </div>
    <span style="font-size:30px;cursor:pointer" onclick="openNav()">&#9776; open</span>
    <div style="position:absolute;top:160px; width:300px; height:200px; z-
    index:2;font-size:100%">
    <h1><center><b><font size=8><font color="#8B0000">.ACT <center><font
    color="#FF8C00">A</font><font color="#8B0000">U</font><font
    color="#FF6347">D</font><font color="#8B0000">I</font><font
    color="#FF8C00">T.</center></font></b></center></h1>
    </div>
    </div>
    </video>
    </div>
    <img src="Serg.jpg" width="920" height="277" alt="The Scream">
    <h1><small><font size=3>&copy 2020 Tout droit réservé</small></h1></font>
    <script>
    function openNav() {
    document.getElementById("myNav").style.display = "block";
    }

    function closeNav() {
    document.getElementById("myNav").style.display = "none";
    }
    </script>
    </body>
    </html>

    You might also like