Scribd Logo
Cargar

¡Te damos la bienvenida a Scribd!

  • Practica 1 Maquetacion

    Cargado por

    Cesar Santos Fajardo
    3 vistas3 páginas

    Derechos de autor

    © © All Rights Reserved

    Formatos disponibles

    PDF, TXT o lea en línea desde Scribd

    ¿Le pareció útil este documento?

    ¿Este contenido es inapropiado?

    Denunciar este documento

    Copyright:

    © All Rights Reserved
    Descargue como PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    3 vistas3 páginas

    Practica 1 Maquetacion

    Cargado por

    Cesar Santos Fajardo

    Copyright:

    © All Rights Reserved
    Descargue como PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    de 3

    Objetivo: Maqueta la siguiente pag web e investiga cada etiqueta del codigo (anotar en

    libreta)

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Maquetacion</title>
    <link rel="stylesheet"href="CSS/estilo.css">
    </head>
    <body>
    <div class="contenedor">
    <header>
    <h1>Maquetacion</h1>
    </header>
    <nav>
    <h2>Menu</h2>
    </nav>
    <section>
    <article>
    <h2>contenido</h2>
    </article>
    <article>
    <h2>contenido</h2>
    </article>
    <article>
    <h2>contenido</h2>
    </article>
    </section>
    <aside>
    <h2>Publicidad</h2>
    </aside>
    <footer>
    <h2>Pie de pagina</h2>
    </footer>
    </div>
    </body>
    </html>
    Realiza el siguiente código en un archivo con la terminación .css
    *{
    margin: 0 auto;
    padding: 0px;
    }
    body {
    background:#ccc;
    color:#fff;
    }
    .contenedor {
    width: 1000px;
    margin-top: 20px;
    margin-bottom: 20px;
    }
    header {
    height: 150px;
    background: #0080FF;
    }
    header h1 {
    font-size: 50px;
    text-align: center;
    line-height: 150px;
    }
    nav {
    background: #DF3A01;
    height: 60px;
    }
    nav h2 {
    font-size: 40px;
    text-align: center;
    line-height: 60px;
    }
    section {
    width: 730px;
    height: 745px;
    float: left;
    background: #000000;
    margin-top: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    }
    section article {
    background: #00FFFF;
    height: 220px;
    margin: 20px;
    border: solid 2px#fff;
    }
    section article h2 {
    font-size: 40px;
    text-align: center;
    line-height: 220px;
    }
    aside {
    width: 250px;
    height: 745px;
    background: #0B3861;
    margin-top: 10px;
    float: right;
    }
    aside h2 {
    font-size: 40px;
    text-align: center;
    line-height: 500px;
    }
    footer {
    background: #0080FF;
    clear: both;
    }
    footer h2 {
    font-size: 40px;
    text-align: center;
    padding: 20px;
    font-style: italic;
    }

    También podría gustarte