PDF de programación - Desarrollo web con HTML5 y CSS3

Desarrollo web con

HTML5 y CSS3

Este manual va a describir el desarrollo web de contenido estático
con el lenguaje de etiquetado HTML en su versión 5, y el lenguaje
para formateado web CSS en su versión 3.

Desarrollo web con HTML5 y CSS3 by Rafael Lozano is licensed under a Creative Commons
Reconocimiento-NoComercial-CompartirIgual 3.0 España License.

Información técnica
Nivel de usuario: Medio

Conocimientos previos: No son necesarios conocimientos previos, salvo el uso a nivel de
usuario de un ordenador con sistema operativo Windows o Linux, lo que incluye instalación de
aplicaciones y navegación por Internet.

Las herramientas necesarias para el desarrollo web son de uso fácil e intuitivo y no requieren una
formación específica para un uso básico.
Fecha del documento: Agosto 2013

Tabla de contenido

Tabla de contenido

1. Introducción al desarrollo web......................................................................................................1
1.1 Introducción .................................................................................................................................................1
1.2 El servicio www.............................................................................................................................................2
1.3 ¿Qué se necesita para crear un sitio web?............................................................................................4
1.3.1 Editores web................................................................................................................................................ 4
1.3.2 Navegadores web....................................................................................................................................... 5
1.3.3 Servidor web................................................................................................................................................ 5
1.4 Instalación de las herramientas necesarias..........................................................................................6
1.4.1 Internet Information Services..................................................................................................................6
1.4.2 Komodo Edit................................................................................................................................................ 7
1.4.3 Navegadores............................................................................................................................................... 8
2. Introducción a HTML........................................................................................................................9
2.1 El lenguaje de etiquetado HTML..............................................................................................................9
2.1.1 Evolución histórica de HTML...................................................................................................................9
2.2 El consorcio W3C.......................................................................................................................................11
2.3 Navegadores que soportan HTML 5....................................................................................................11
2.4 Mi primera página web............................................................................................................................12
2.5 Sintaxis HTML.............................................................................................................................................13
2.5.1 Componentes de un documento web...............................................................................................14
2.5.1.1 Elementos............................................................................................................................................... 14
2.5.1.2 Atributos.................................................................................................................................................. 15
2.5.1.3 Atributos globales.................................................................................................................................16
2.5.1.4 Comentarios........................................................................................................................................... 16
2.6 Estructura de un documento HTML.....................................................................................................17
2.6.1 Tipo de documento y elemento raíz...................................................................................................17
2.6.2 Cabecera del documento......................................................................................................................17
2.6.2.1 Título del documento...........................................................................................................................17
2.6.2.2 Elemento meta....................................................................................................................................... 18
2.6.3 Cuerpo del documento.......................................................................................................................... 18
3. Texto..................................................................................................................................................19
3.1 Incluir texto en una página web............................................................................................................19
3.2 Párrafos........................................................................................................................................................19
3.3 Saltos de línea............................................................................................................................................20
3.4 Texto preformateado...............................................................................................................................21
3.5 Encabezados...............................................................................................................................................21
3.6 Separadores...............................................................................................................................................22
3.7 Elementos textuales en línea.................................................................................................................23
3.7.1 Títulos......................................................................................................................................................... 23
3.7.2 Texto entrecomillado.............................................................................................................................. 24
3.7.3 Acrónimos.................................................................................................................................................. 24
3.7.4 Superíndices y subíndices.....................................................................................................................24
3.7.5 Marcas........................................................................................................................................................ 24

Índice I

3.7.6 Elemento span.......................................................................................................................................... 25
3.7.7 Elementos para estilos........................................................................................................................... 25
3.8 Caracteres especiales...............................................................................................................................25
4. Introducción a CSS..........................................................................................................................29
4.1 El origen de CSS.........................................................................................................................................29
4.1.1 ¿Qué puedo hacer con CSS?.................................................................................................................30
4.1.2 ¿Qué diferencias hay entre HTML y CSS?..........................................................................................30
4.1.3 ¿Qué beneficios me ofrece CSS?..........................................................................................................30
4.1.4 Características CSS.................................................................................................................................. 31
4.2 Aplicando CSS a un documento HTML................................................................................................31
4.2.1 Estilo en línea............................................................................................................................................ 32
4.2.2 Estilo por ámbito...................................................................................................................................... 32
4.2.3 Hoja de estilo interna.............................................................................................................................. 33
4.2.4 Hoja de estilo externa............................................................................................................................. 33
4.3 Las reglas de estilo....................................................................................................................................34
4.3.1 El selector.................................................................................................................................................. 36
4.3.2 Propiedades y valores...................................................................................................