Curso de Maquetación con Bootstrap 3.
Índice de Contenidos:
1. Herramientas a utilizar en el curso
2. Qué es CSS
2.1. Para qué sirve
2.2. Cómo funciona
2.3. Aplicar las hojas de estilo a un documento HTML
2.3.1. Hoja de estilos externa
2.3.2. Elemento STYLE
2.3.1. Atributo STYLE
3. CSS2 Help Sheet
4. CSS3 Help Sheet
5. Selectores
5.1. Selectores universales
5.2. Selectores de atributo
5.2.1. Selección por el valor de un atributo
5.2.2. Selección basándose en una sub-cadena dentro del valor de un atributo
5.2.3. Selección basándose en elementos delimitados dentro del valor de un atributo
5.3. Selector de secundarios (hijos)
5.4. Selector de descendientes
5.5. Selector de hermano adjacente
5.6. Selectores de hermano general
6. Pseudo-clases
6.1. Pseudoclases de enlace y acción de usuario
6.1.1. link
6.1.2. visited
6.1.3. focus
6.1.4. hover
6.1.5. active
6.2. Pseudoclase de negación (not)
6.3. Pseudoclase de idioma (lang)
6.4. Pseudoclase de destino (target)
6.5. Pseudoclases de entrada (valid, invalid)
6.6. Pseudoclases de estado (enabled y disabled)
6.7. Pseudoclases estucturales
6.7.1. root
6.7.2. nth-child(n) y nth-last-child(n)
6.7.3. nth-of-type(n) y nth-last-of-type(n)
6.7.4. first-child y last-child
6.7.5. first-of-type y last-of-type
6.7.6. only-child
6.7.7. only-of-type
6.7.8. empty
6.8. Índice de pseudo-clases estándar
7. Pseudoelementos
7.1. first-letter
7.2. first-line
7.3. Contenido generado usando before y after
7.4. La función counter
7.4.1. Configuración del contador (counter-reset)
7.4.2. Incrementar el contador (counter-increment)
7.4.3. Mostrando el contador
7.4.4. El uso de dos o más contadores
7.4.5. El uso de contadores anidados (counters)
7.4.6. Dando estilo a los contadores
7.5. Sintaxis con doble dos puntos de CSS3 para pseudoelementos
8. Hacks de CSS
8.1. Comentarios condicionales
8.2. Hacks de Internet Explorer por Versón
8.3. Hack de Chrome
8.4. Hack para Firefox
9. Algunos consejos para principiantes
9.1. Utilizar una página de reinicialización de estilos
9.2. Comprender la diferencia entre id y class
9.3. Añadir comentarios al CSS
9.4. enternder la potencia de !important
9.5. Evitar el uso de tablas
9.6. Esconder el texto detrás de una imagen
9.7. Utilizar código optimizado (shorthand)
10. HTML5Reset v1.6.1
11. Normalize v4.1.1
12. Qué es Bootstrap
13. Instalación de Bootstrap 3
14. Introducción a Bootstrap
14.1. Inicialización y definición de páginas en Bootstrap
14.1.1. Requerimiento del doctype de HTML5
14.1.2. El metadato viewport
14.2. Sistema de rejilla
14.2.1. Media queries
14.2.2. Características de cada rejilla
14.3. Tipografías y enlaces
14.3.1. Titulares
14.3.2. Texto
14.3.3. Texto destacado
14.3.4. Clases CSS para alinear texto
14.3.5. Clases CSS para indicar el tipo de contenido
14.3.6. Direcciones
14.3.7. Blockquotes
14.3.8. Listas de definición
14.4. Normalización de estilos
14.5. Ejemplos
14.5.1. Diseño fijo (Fixed Layout)
14.5.1. Diseño fluido (Fluid Layout)
14.5.2. Autoajustado de columnas
14.5.3. Reestablecimiento de columnas
14.5.4. Desplazamiento de columnas
14.5.5. Anidación de columnas
14.5.6. Ordenación de columnas
15. Componentes
15.1. Iconos (glyphicons)
15.1.1. Cómo utilizar los iconos
15.2. Menús desplegables
15.2.1. Deshabilitando elementos del menú
15.2.2. Títulos de sección
15.3. Grupos de botones
15.3.1. Ejemplo básico
15.3.2. Cambiando el tamaño de los botones
15.3.3. Anidación de grupos de botones
15.3.4. Menús verticales
15.3.5. Botones justificados
15.4. Botones desplegables
15.4.1. Ejemplo básico
15.4.2. Botones desplegables de doble acción
15.4.3. Cambiar el tamaño de los botones
15.4.4. Botones desplegables invertidos
15.5. Imágenes responsive (IMG)
15.6. Navegación por pestañas
15.7. Navegación por botones
15.8. Barras de navebación (navbar)
15.9. Mensajes de alerta
15.9.1. Ejemplo básico
15.9.2. Mensajes de alerta con botón de cerrado
15.9.3. Alertas con enlace
15.10. Barras de progreso
15.10.1. Ejemplo básico
15.10.2. Barras de progreso cebreadas
15.10.3. Barras de progreso animadas
15.10.4. Barras de progreso segmentadas
15.11. Paneles
15.11.1. Ejemplo básico
15.11.2. Paneles con cabecera o título
15.11.3. Paneles con footer o pié
15.11.4. Paneles contextuales
15.11.5. Paneles con listas
15.12. Presentación de diapositivas (Carousel)
15.13. Presentaciones de tipo Jumbotron
15.14. Migas de pan (Breadcrumbs)
15.15. Inclusión de videos (responsive-embed)
15.16. Tablas
15.16.1. Tabla básica
15.16.2. Tabla rayada (table-striped)
15.16.3. Tablas con bordes (table-bordered)
15.16.4. Tabla con efecto hover (table-hover)
15.16.5. Tablas compactas (table-condensed)
15.16.6. Tablas contextuales
15.16.7. Tablas Responsive
15.17. Ejemplo “Hola mundo”
16. Plugins bootstrap interesantes
16.1. Bootstrap Lightbox
16.2. Bootbox
16.3. Fuel UX
16.4. Jasny
16.5. Bootstrap Image Gallery
16.6. Bootstrap Modal
16.7. Bootstrap Growl
16.8. Bootstrap Notify
16.9. Bootstrap Form Helpers
16.10. Bootstrap Tags
16.11. Bootstrap Switch
16.12. 13. Bootstrap Markdown
16.13. 14. Bootstrap Maxlength
16.14. 15. Bootstrap Select
17. Bootstrap Help Sheet
18. Referencias
En formato pdf. Contiene 90 páginas.
Electrónica básica
