Scribd Logo
Cargar

¡Te damos la bienvenida a Scribd!

  • Ejercicios Básicos Div

    Cargado por

    Pablo Jimenez
    2 vistas3 páginas

    Título original

    Ejercicios básicos div

    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
    2 vistas3 páginas

    Ejercicios Básicos Div

    Cargado por

    Pablo Jimenez

    Copyright:

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

    EJERCICIOS básicos de DIV

    <div class=""> </div> => La etiqueta div permite asignar un estilo a una sección, es decir un
    conjunto grande de bloques, dentro del documento HTML.

    Por ejemplo asigna un color diferente a todo el texto, para ello utiliza div para que quede como
    esta imagen.

    SOLUCIÓN:

    <html>
    <head>
    <title> Etiqueta div </title>
    <! ––FALTAN los METAS––>
    <style>
    .estilo1 {color:red; }
    .estilo2 {color:blue; }
    </style>
    </head>

    <body>

    <h1> Etiqueta div </h1>

    <p>
    La etiqueta "div" permite agrupar varias
    etiquetas en un sólo bloque y aplicarles un
    estilo común a todas ellas.
    </p>
    <div class="estilo1">
    <p>Periféricos de entrada</p>
    <ul>
    <li>Ratón</li>
    <li>Teclado</li>
    </ul>
    </div>

    <div class="estilo2">
    <p>Periféricos de salida</p>
    <ul>
    <li>Impresora</li>
    <li>Monitor</li>
    </ul>
    </div>

    </body>
    </html>

    Estilos en cascada
    CSS son las siglas de Hoja de Estilos en Cascada (Cascading Style Sheet). Esto significa que los
    estilos se heredan en cascada desde las secciones superiores hasta los elementos que se encuentran
    dentro de ellas.
    Por ejemplo si hay un párrafo dentro de una lista: <li> <p>Párrafo</p> </li> El párrafo
    heredará los estilos que se han aplicado a la lista.
    En este ejercicio vamos a introducir un bloque dentro de otro de manera que los bloques interiores
    van a ir heredando todos los estilos del bloque donde se encuentran.
    Realiza una página web donde el tercer nivel ese dentro del segundo y el segundo,a su vez, dentro
    del primero. En el primero se indica que la letra es azul, en el segundo que el tamaño de letra es
    28px, y en el tercero que el fondo es amarillo (yellow).
    <html>
    <head>
    <title> Estilos en cascada </title>
    <! ––FALTAN los METAS––>
    <link rel="stylesheet" type="text/css" href="css-cascading.css" >

    </head>

    <body>
    <div >
    <h1> Estilos en cascada </h1>
    </div>
    <div class="estilo1">
    <p>Primer nivel (color azul)</p>
    <div class="estilo2">
    <p>Segundo nivel (letra grande)</p>
    <div class="estilo3">
    <p>Tercer nivel (fondo amarillo)</p>
    </div>
    </div>
    </div>

    </body>
    </html>

    Fichero css-cascading.css (la hoja de estilo está en el archivo . css)

    También podría gustarte