Sinopsis

La Web y las apps para dispositivos móviles se ha convertido en parte imprescindible de nuestras vidas; desde las consultas y búsquedas de información, a disfrutar de las redes sociales, y realizar compras o numerosas gestiones o trámites. CSS ha permitido que todos los elementos que componen el código se muestren ante el usuario con una atractiva apariencia, la estructura y los efectos deseados, permitiendo al visitante una eficiente usabilidad y una auténtica experiencia de usuario.

Esta obra nos muestra cuáles son las herramientas necesarias y cómo usarlas para generar hojas de estilos en cascada imprescindibles para todo diseñador, maquetador o desarrollador front en su trabajo diario. Presenta las técnicas actuales que nos brinda CSS3 sin olvidar las ya existentes, y las que nos deparan versiones futuras. Se abordará el cross browsing para que nuestros estilos, animaciones y efectos se apliquen correctamente en cualquier navegador, y el diseño adaptativo y responsive para que el mismo código muestre distintos resultados en función del dispositivo (móvil, tableta, ordenador, etc.) en el que se visualice. Además, cuenta con ejemplos prácticos y reales, extrapolables a cualquier proyecto.

Índice

1. Introducción
1.1. ¿Cómo usar esta guía?
1.2. Conocimientos previos
1.3. ¿Qué herramientas necesito?
1.4. Navegadores
1.4.1. Los distintos navegadores
1.4.2. El inspector de elementos

2. Conceptos básicos de CSS
2.1. ¿Qué es CSS?
2.2. ¿Cómo se aplican los estilos?
2.2.1. El atributo style
2.2.2. Definir estilos en la etiqueta <style>
2.2.3. Definir estilos en el CSS

3. Selectores
3.1. Selectores básicos
3.1.1. Elementos HTML (tags)
3.1.2. Clases
3.1.3. Identificadores
3.2. Selectores compuestos
3.2.1. Selectores anidados
3.2.2. Especificidad
3.2.3. Importancia del orden
3.2.4. El uso de ¡important
3.2.5. Selectores múltiples
3.2.6. Más combinaciones
3.3. Selectores especiales
3.3.1. Selectores de atributos
3.3.2. Pseudo-clases
3.3.3. Pseudo-elementos

4. Media Queries
4.1. ¿Qué son las media queries?
4.2. Tipos de dispositivos (media types)
4.3. Expresiones (media features)
4.4. Diseño responsive

5. Layout
5.1. Elementos del layout
5.1.1. El esqueleto
5.2. La propiedad display
5.2.1. Display block
5.2.2. Display inline
5.3. Anchura, altura y márgenes
5.3.1. Unidades de medida
5.3.2. La propiedad width
5.3.3. La propiedad height
5.3.4. La propiedad box-sizing
5.3.5. Valores máximos y mínimos
5.3.6. La propiedad margin
5.3.7. La propiedad padding
5.4. Elementos flotantes
5.4.1. La propiedad float
5.4.2. La propiedad clear
5.5. Flexbox
5.5.1. El modelo layout flexbox
5.5.2. Propiedades para el padre (flex container)
5.5.3. Propiedades para los hijos (flex children)
5.6. Grid
5.6.1. Introducción a grid
5.6.2. Grid-template
5.6.3. Grid-column
5.6.4. Grid-row
5.6.5. Grid-area
5.6.6. Distribuir y alinear
5.6.7. Grid-auto
5.6.8. Grid

6. Position
6.1. El posicionamiento de elementos
6.2. Las capas (z-index)
6.3. Tipos de posicionamiento
6.3.1. Relativo
6.3.2. Absoluto
6.3.3. Fijado

7. Textos
7.1. Fuentes tipográficas
7.1.1. Añadir una fuente tipográfica
7.1.2. Font-face
7.1.3. Propiedades de las fuentes
7.2. Alinear y distribuir textos
7.2.1. Text-align
7.2.2. Line-height
7.2.3. La orientación
7.3. Listados
7.3.1. Tipos de listados
7.3.2. Propiedades de los listados
7.4. Tablas
7.5. Desbordamientos
7.6. Iconos

8. Efectos
8.1. El color
8.1.1. Tipos de color
8.1.2. Trabajar con colores
8.2. La opacidad
8.2.1. Tipos de opacidad
8.2.2. Diferencias entre propiedades
8.3. Los bordes
8.3.1. Border
8.4. Imágenes
8.4.1. Efectos
8.4.2. Encajar imágenes
8.5. Los fondos
8.5.1. Trabajar con fondos
8.5.2. Background
8.6. Destacar elementos
8.6.1. Propiedades para resaltados
8.6.2. Transformar elementos
8.6.3. El 3D

9. Animaciones
9.1. ¿Cómo funciona?
9.2. Transition
9.2.1. Keyframes
9.2.2. Propiedades de transition

10. Herramientas útiles
10.1. Compiladores
10.1.1. ¿Cómo se usa un compilador?
10.1.2. SASS
10.1.3. LESS
10.2. Variables CSS
10.3. Crossbrowser
10.3.1. Prefijos
10.3.2. Guía de propiedades
10.4. Webs de referencia
10.4.1. W3C
10.4.2. Otras webs de utilidad

Índice alfabético