CURSO HTML_CCS_2 Módulo 1_Actividad 4: Presentación de Página Web

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

Tienes que tener en cuenta los siguientes requisitos:

• El texto principal:
  • El color del texto es azul: #00F.
  • El tipo de letra es la secuencia: Georgia, Cambria, serif.
  • El tamaño del texto: 16px.
• El encabezado de nivel 1:
  • El color del texto es rojo claro: #F00.
  • El tipo de letra es la secuencia: Verdana, Calibri, sans-serif.
  • El tamaño del texto: 32px.
• El encabezado de nivel 2:
  • El color del texto es rojo claro: #A00.
  • El tipo de letra es la secuencia: Verdana, Calibri, sans-serif.
  • El tamaño del texto: 24px.
• El color de los campos de los datos del libro es verde oscuro: #060.
• El texto "Internet" y la "Web" cuando actúan como sustantivos:
  • El tamaño del texto: 20px.
  • Texto en negrita.
• El texto "Hypertext Markup Language", "Cascading Style Sheets" y los acrónimos "HTML" y "CSS":
  • El color del texto es blanco: #FFF.
  • El color de fondo del texto es negro: #000.
  • Texto en cursiva.

Consejo: puedes utilizar las etiquetas de HTML <em> y <strong>.

Consejo: puedes utilizar la etiqueta de HTML <span> para aplicar un estilo CSS a cualquier parte del texto.

SOLUCIÓN

<meta charset="utf-8">

<title>HTML &amp; CSS: Curso práctico avanzado</title>

<h1 style="color: #F00; font-family: Verdana, Calibri, Sans-serif; font-size: 32px;" >HTML &amp; CSS: Curso práctico avanzado</h1>

<h2 style="color: #A00; font-family: Verdana, Calibri, Sans-serif; font-size: 24x;">Datos del libro</h2>

<ul>

<li> <span style="color: #060;">Título: </span>HTML &amp; 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>944049-4-8</li>

</ul>

<h2 style="color: #A00; font-family: Verdana, Calibri, Sans-serif; font-size: 24x;">Descripción del libro</h2>

<p>

Aunque los inicios de  <span style="font-weight: bold;font-size: 20x"> Internet</span> se remontan a los años sesenta, no ha sido hasta los años noventa cuando, gracias a la <span style="font-weight: bold;font-size: 20x">Web</span>, se ha extendido su uso por todo el mundo. En pocos años, la <span style="font-weight: bold;font-size: 20x">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-weight: bold;"> (Hypertext Markup Language, HTML) </span> y con las Hojas de estilo en cascada <span style="color: #FFF; background-color: #000; font-weight: bold;"> (Cascading Style Sheets, CSS) </span>.

</p>

<p>

Este libro es adecuado para cualquiera que tenga interés en aprender a desarrollar sus propias páginas web. No son necesarios conocimientos previos para aprender con este libro, lo único que es necesario es saber utilizar un ordenador y saber navegar por la Web.

</p>

<h2 style="color: #A00; font-family: Verdana, Calibri, Sans-serif; font-size: 24x;">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 URL 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-weight: bold;">HTML</span> y <span style="color: #FFF; background-color: #000; font-weight: bold;">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-weight: bold;">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-weight: bold;">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 CSS, 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.</li>

</ul>