Scribd Logo
Upload

Welcome to Scribd!

  • Layout1 3

    Uploaded by

    dangnguyennguyen16
    2 views5 pages

    Original Title

    layout1_3

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

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

    Layout1 3

    Uploaded by

    dangnguyennguyen16

    Copyright:

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

    <!

    DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>LAYOUT1</title>
    <style>
    *{
    box-sizing: border-box;
    margin: auto;
    }
    .tong{
    width: 980px;
    height: 800px;
    border: 1px solid brown;
    margin-top: 20px;
    background-color: azure;
    }
    header{
    background-image: url(../IMAGE/Glogo.jpg);
    background-size: cover;
    width: 100%;
    height: 200px;
    border-bottom: 1px solid brown;
    }
    section{
    width: 100%;
    height: 400px;
    border-bottom: 1px solid brown;
    }
    footer{
    width: 100%;
    height: 197px;
    background-color: bisque;
    }
    </style>
    </head>
    <body>
    <div class="tong">
    <header>logo</header>
    <section>noi dung</section>
    <footer>địa chỉ</footer>

    </div>
    </body>
    </html>
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>LAYOUT 3</title>
    <style>
    *{
    box-sizing: border-box;
    margin: auto;
    }
    .tong{
    width: 980px;
    height: 800px;
    border: 1px solid red;
    margin-top: 20px;

    }
    header{
    width: 100%;
    height: 150px;
    border-bottom: 1px solid red;
    }
    .menungang{
    width: 100%;
    height: 50px;
    border-bottom: 1px solid red;
    }
    .con{
    width: 100%;
    height:400px ;
    border-bottom: 1px solid red;
    }
    .menudoc{
    width: 20%;
    height: 100%;
    border-right: 1px solid red;
    float: left;
    }
    section{
    width: 50%;
    height: 100%;
    border-right: 1px solid red;
    float: left;
    }
    aside{
    width: 30%;
    height: 100%;
    float: left;
    }
    footer{
    clear: both;
    width: 100%;
    height: 197px;
    background-color: azure;

    }
    .c1 li{
    display: inline-block;
    width: 100px;
    line-height: 50px;
    list-style-type: none;
    }
    .c11 li{
    list-style-type: none;
    height: 50px;
    margin-top: 10px;
    }

    </style>
    </head>
    <body>
    <div class="tong">
    <header>logo</header>
    <nav class="menungang">
    <ul class="c1">
    <li>layout 1</li>
    <li>layout 2</li>
    <li>layout 3</li>
    <li>layout 4</li>
    <li>layout 5</li>
    </ul>
    </nav>
    <div class="con">
    <nav class="menudoc">
    <ul class="c11">
    <li>menu doc 1</li>
    <li>menu doc 2</li>
    <li>menu doc 3</li>
    <li>menu doc 4</li>
    <li>menu doc 5</li>
    <li>menu doc 6</li>
    </ul>
    </nav>
    <section>noi dung</section>
    <aside> noi dung</aside>
    </div>
    <footer> địa chỉ</footer>
    </div>

    </body>
    </html>

    You might also like