El gran libro de
HTML5, CSS3 y Javascript
El gran libro de
HTML5, CSS3 y Javascript
J. D. Gauchat
El gran libro de HTML5, CSS3 y Javascript
Primera edición, 2012
© 2012 Juan Diego Gauchat
© MARCOMBO, S.A. 2012
Gran Via de les Corts Catalanes, 594
08007 Barcelona
www.marcombo.com
Los códigos fuente para este libro se encuentran disponibles en www.minkbooks.com.
«Cualquier forma de reproducción, distribución, comunicación pública o transformación de
esta obra sólo puede ser realizada con la autorización de sus titulares, salvo excepción prevista
por la ley. Diríjase a CEDRO (Centro Español de Derechos Reprográficos, www.cedro.org) si
necesita fotocopiar o escanear algún fragmento de esta obra».
ISBN eBook: 978-84-267-1782-5
DL: SE-7867-2011
Impreso en Publidisa
Printed in Spain
Dedicado a aquellos
que ya no están a mi lado
Índice
Capítulo 1. Documentos HTML5 ............................................................. 1
1.1 Componentes básicos ........................................................................................... 1
1.2 Estructura global .......................................................................................................... 2
<!DOCTYPE> ............................................................................................................... 2
<html> ........................................................................................................................ 2
<head> ........................................................................................................................ 3
<body> ........................................................................................................................ 4
<meta> ....................................................................................................................... 5
<title> ......................................................................................................................... 6
<link> .......................................................................................................................... 7
1.3 Estructura del cuerpo ............................................................................................ 8
Organización .............................................................................................................. 9
<header> .................................................................................................................. 12
<nav> ........................................................................................................................ 13
<section> .................................................................................................................. 14
<aside> ..................................................................................................................... 15
<footer> .................................................................................................................... 17
1.4 Dentro del cuerpo ............................................................................................... 18
<article>.................................................................................................................... 18
<hgroup> .................................................................................................................. 22
<figure> y <figcaption> ............................................................................................ 24
1.5 Nuevos y viejos elementos .................................................................................. 26
<mark> ..................................................................................................................... 26
<small> ..................................................................................................................... 27
<cite> ........................................................................................................................ 27
<address> ................................................................................................................. 27
<time> ...................................................................................................................... 28
1.6 Referencia rápida ................................................................................................ 28
Capítulo 2. Estilos CSS y modelos de caja .............................................. 31
2.1 CSS y HTML ......................................................................................................... 31
2.2 Estilos y estructura .............................................................................................. 32
Elementos Block ....................................................................................................... 32
Modelos de caja ....................................................................................................... 33
2.3 Conceptos básicos sobre estilos ........................................................................... 34
Estilos en línea .......................................................................................................... 34
Estilos embebidos ..................................................................................................... 35
Archivos externos ..................................................................................................... 36
Referencias ............................................................................................................... 37
Referenciando con palabra clave ............................................................................. 37
Referenciando con el atributo id .............................................................................. 38
Referenciando con el atributo class ......................................................................... 39
Referenciando con cualquier atributo ...................................................................... 40
Referenciando con pseudo clases ............................................................................. 41
Nuevos selectores ..................................................................................................... 45
2.4 Aplicando CSS a nuestra plantilla ......................................................................... 46
2.5 Modelo de caja tradicional .................................................................................. 46
Plantilla .................................................................................................................... 47
Selector universal * .................................................................................................. 49
Nueva jerarquía para cabeceras .............................................................................. 50
Declarando nuevos elementos HTML5 ..................................................................... 51
Centrando el cuerpo ................................................................................................. 51
Creando la caja principal .......................................................................................... 52
La cabecera .............................................................................................................. 53
Barra de navegación ................................................................................................ 54
Section y aside .......................................................................................................... 55
Footer ....................................................................................................................... 56
Últimos toques ......................................................................................................... 58
Box-sizing ................................................................................................................. 59
2.6 Referencia rápida ................................................................................................ 60
Selector de atributo y pseudo clases ........................................................................ 61
Selectores ................................................................................................................. 61
Capítulo 3. Propiedades CSS3 ............................................................... 63
3.1 Las nuevas reglas ................................................................................................ 63
CSS3 se vuelve loco ................................................................................................... 63
Plantilla .................................................................................................................... 64
Border-radius ............................................................................................................ 65
Box-shadow .............................................................................................................. 67
Text-shadow ............................................................................................................. 70
@font-face ............................................................................................................... 71
Gradiente lineal ........................................................................................................ 72
Gradiente radial ....................................................................................................... 74
RGBA ......................................................................................................
Crear cuenta
Comentarios de: El gran libro de HTML5, CSS3 y Javascript (2)