CURSO DE HOJAS DE ESTILOS CSS y Divs

UNIDAD 1 – LA INTERFASE

• WEB 2.0
• Que es la web 2.0?
• Ejemplos de Web 2.0
• Tecnologías de la web 2.0
• INTRODUCCIÓN AL LENGUAJE HTML
• Que es HTML?
• Estructura básica de un documento HTML
• XHTML
• QUE ES EL XHTML?
• Migrando de HTML a XHTML
• CSS
• Que es el CSS
• Cuales son los beneficios de trabajar con CSS
• Versiones de CSS
• TRABAJANDO CON CSS
• Declaración de reglas de estilo
• Hoja de estilo externa
• Hoja de estilo embebida en el encabezado del documento
• Estilos en línea
• Creación de una hoja de estilo desde el Dreamweaver
• Vinculación de una hoja de estilo
• Diferencia entre vinculación e importación de una hoja de estilo
• Reglas de estilo
• Creación de una regla de estilo desde Dreamweaver
• Edición de una regla de estilo desde Dreamweaver
• Sintaxis de las reglas de estilo
• Selectores
• Formato de comentario
• Estructura y Herencia
• Selectores de grupo
• Atributos tipográficos
• Font Family (Familia de fuente)
• Font Style (Estilo de fuente)
• Font Variant (Variante de fuente )
• Font Weight (Peso de fuente)
• Font Size (Tamaño de fuente)
• Font (Fuente) // declaración en una sola línea
• Atributos de color
• Color

UNIDAD 2 - DIAGRAMACIÓN BÁSICA

• ETIQUETA DIV
• PORQUE REEMPLAZAR LAS TABLAS POR ETIQUETAS DIV
• SELECTORES DE ID
• ATRIBUTOS DE TAMAÑO
• Width (ancho)
• height (alto)
• ATRIBUTOS DE FONDO
• Background-color (color de fondo)
• Background Image (Imagen de fondo)
• Background Repeat (Repetir fondo)
• Background Attachment (Fijación de fondo)
• Background Position (Posición del fondo)
• Background (Fondo) (declaración de una sola línea)
• DIAGRAMACIÓN DE UNA COLUMNA
• DIAGRAMACIÓN DE UNA COLUMNA DE DOS Y TRES COLUMNAS POR FLOTACIÓN
• UTILIZACIÓN DEL ATRIBUTO FLOAT
• Utilización del atributo Clear
• Anidamiento de divs
• Modelo de caja
• ATRIBUTOS DE LA CAJA
• Margin (margen)
• Borde (Border)
• Relleno (Padding)
• ESCRITURA RESUMIDA (DECLARACIÓN DE UNA SOLA LÍNEA)
• Declaración una línea para el padding
• Declaración una línea para el margin
• Declaración una línea para el borde

UNIDAD 3 - DIAGRAMACIÓN AVANZADA

• DIAGRAMACIÓN AVANZADA CON POSICIÓN
• Atributos de posición
• Static (estático)
• Relative (relativo)
• Absolute (absoluto)
• Fixed
• DIAGRAMACIÓN CENTRADA
• Selector universal

UNIDAD 4 - BARRAS DE NAVEGACIÓN

• LISTAS
• Listas Ordenadas
• Listas desordenadas
• Declaración de una sola línea
• CREACIÓN DE BARRAS DE NAVEGACIÓN
• SELECTORES DESCENDIENTES
• Pseudo Elementos y Pseudo clases
• Pseudoclases de vínculos:
• Pseudo Clases dinámicas
• PSEUDO ELEMENTOS
• El pseudo-elemento :first-line
• El pseudo-elemento :first-letter
• Los pseudo-elementos :before y :alter

UNIDAD 5 - CLASES Y ESTILOS EN LÍNEA

• SELECTORES DE CLASE
• SELECTORES DE CONTEXTO
• Orden de cascada
• Jerarquías y especificidad
• Estilos en línea
• Atributo de overflow
• Atributo de Z-index
• FILTRO DE OPACIDAD
• Opacidad en Internet Explorer
• Opacidad en Firefox, Opera, Chrome...

UNIDAD 6 - INTEGRACIÓN

• DIAGRAMACIÓN DE INTERFAZ DE ALTURA VARIABLE
• HACKS
• El hack del guión bajo
• El uso de !important
• ASIGNACIÓN DE HOJAS DE ESTILO POR NAVEGADOR MEDIANTE IF

LABORATORIOS

• LABORATORIO 01
• TP 01 - Migración de html a xhtml
• TP 02 - Etiquetas y herencia
• LABORATORIO 02
• TP 03 - Estructura de una columna con tablas
• TP 04 - Estructura de una columna con divs y css
• TP 04 Estructura de dos columna con divs y css
• TP 05 Estructura de tres columna con divs y css
• TP 06 Inserción y ubicación de contenidos
• LABORATORIO 03
• TP 07 Diagramación básica con position:relative
• TP 08 Diagramación básica con position:absolute
• TP 09 Diagramación avanzada con position:relative y absolute
• TP 10 Diagramación centrada
• LABORATORIO 04
• TP 11 Barra de navegación horizontal
• TP 12 Barra de navegación horizontal con imágenes
• TP 13 Barra de navegación vertical
• TP 14 Barra de navegación horizontal con links
• TP 15 Barra de navegación horizontal con imágenes con links
• TP 16 Barra de navegación vertical con links
• LABORATORIO 05
• TP 17 Manejo de clases
• TP 18 Manejo de contenido fijo
• TP 19 Manejo de contenido variable
• TP 20 Opacidad
• LABORATORIO 06
• TP 21 Manejo de hacks
• TP 22 Proyecto Integrador