5.5. CSS: cómo se usa en HTML (parte 2) ~ Introducción al Desarrollo Web

5.5. CSS: cómo se usa en HTML (parte 2)

mayo 02, 2018 Fernando López

A partir de la página web que se te proporciona, debes emplear la etiqueta <style> para crear una página web que tenga el mismo aspecto que la siguiente imagen:

Solución


<!DOCTYPE html>
    <html>
        <meta charset="utf-8">
            <head>
                <title>
                    HTML & CSS: Curso práctico avanzado
                </title>
    <style>
    body {
        color: #00F;
        background: #CFC;
        font-family: Georgia, Cambria, serif;
        font size: 19px;
    }

    h1, h2 {
        font-family: Verdana, Calibri, sans-serif;
    }

    h1 {
        color: #F00; 
        font-size: 32px;
    }

    h2 {
        color: #A00;
        font-size: 24px;
    }
    </style>
            </head>
    <body>
        <h1>
            HTML & CSS: Curso práctico avanzado
        </h1>
        <h2>
            Datos del libro
        </h2>
            <ul>
                <li>
                    <span style="color: #060;">
                        Título:
                    </span>
                        HTML & CSS: Curso práctico avanzado
                </li>
                <li>
                    <span style="color: #060;">
                        Autor:
                    </span>
                        Sergio Luján Mora
                </li>
                <li>
                    <span style="color: #060;">
                        Editorial:
                    </span>
                        Publicaciones Altaria
                </li>
                <li>
                    <span style="color: #060;">
                        Año de publicación:
                    </span>
                        2015
                </li>
                <li>
                    <span style="color: #060;">
                        ISBN:
                    </span>
                        978-84-944049-4-8
                </li>
            </ul>
        <h2>
            Descripción del libro
        </h2>
            <p>
            Aunque los inicios de <span style="font-size: 20px; font-weight: bold;">
            Internet</span>se remontan a los años sesenta, no ha sido hasta los años noventa cuando, gracias a la <span style="font-size: 20px;
            font-weight: bold;">Web </span>, se ha extendido su uso por todo el mundo. En pocos años, la <span style="font-size: 20px; font-weight: bold;">Web</span>ha evolucionado enormemente: se ha pasado de páginas sencillas, con pocas imágenes y contenidos estáticos que eran visitadas por unos pocos usuarios a páginas complejas, con contenidos dinámicos que provienen de bases de datos y que son visitadas por miles de usuarios al mismo tiempo.
            </p>
            <p>
            Todas las páginas están internamente construidas con la misma tecnología, con el Lenguaje de marcas de hipertexto (
            <span style="color: #fff; background-color: #000; font-style: italic;">
            Hypertext Markup Language
            </span>,<span style="color: #FFF; background-color: #000; font-style: italic;">HTML</span>) y con las Hojas de estilo en cascada (
            <span style="color: #fff; background-color: #000; font-style: italic;">
            Cascading Style Sheets, CSS
            </span>).
            </p>
            <p>
            Este libro es adecuado para cualquiera que tenga interen aprender a desarrollar sus propias páginas web. No son necesarios cococimientos previos para aprender con este libro, lo único que es necesario es saber utilizar un ordenador y saber navear por la
            <span style="font-size: 20px; font-weight: bold;">Web</span>
            /p>
        <h2>
            Contenido del libro
        </h2>
            <p>
                El contenido de este libro se estructura en tres apartados bien diferenciados:
            </p>
        <ul>
            <li>
                En la primera parte del libro se trabajan conceptos generales que son necesarios para poder desarrollar páginas web; se explican conceptos de estructura física y estructura lógica (o estructura de navegación) de un sitio web. Se detalla cómo influye la estructura física en las
                <span style="color: #FFF; background-color: #000; font-style: italic;">
                URL</span>o direcciones que se emplean a la hora de crear los enlaces de un sitio web. Pasando por el concepto de "estándar web", un término general que se emplea para refererirse a los estándares que define su funcionamiento como <span style="color: #fff; background-color: #000; font-style: italic;">
                HTML</span>y<span style="color: #fff; background-color: #000; font-style: italic;">CSS</span>, empleados para el desarrollo de las páginas web en el lado del cliente.
            </li>
            <li>
                En la segunda parte se trabaja
                <span style="color: #FFF; background-color: #000; font-style: italic;">
                HTML
                </span>
                . Partiendo de la estructura básica de una página web, se explican las etiquetas de
                <span style="color: #FFF; background-color: #000; font-style: italic;">
                HTML
                </span>
                que se utilizan para definir el texto, los enlaces, las listas, las tablas, los formularios y los elementos multimedia.
            </li>
            <li>
                En la tercera y última parte se explica
                <span style="color: #FFF; background-color: #000; font-style: italic;">
                CSS
                </span>
                , el lenguaje que se emplea para definir el formato y la presentación de una página web. Se explica cómo utilizar el color, cómo definir la presentación del texto, de las tablas y de los formularios; cómo realizar transformaciones y transiciones con el fin de diseñar una página web. En fin, un manual ameno creado desde la experiencia docente y de campo.
            </li>
        </ul>
    </body>
   </meta>
  </html>

Introducción al Desarrollo Web

Este blog forma parte de un ejercicio propuesto por el Curso de Google Actívate "Introducción al desarrollo Web HTML y CSS"

Módulos

Buscar este blog

Denunciar abuso

BTemplates.com

miércoles, 2 de mayo de 2018

5.5. CSS: cómo se usa en HTML (parte 2)

0 comentarios:

Publicar un comentario

Artículos Populares

Módulos del curso

Archivo del Blog