Post on 13-Jun-2015
description
FPE Diseñador Web y MultimediaCarmina Barreiro. Curso de Adams.
Módulo 1. Teoría. Planificar y entender. Módulo 4.
CSS . El diseño con Mayúscula
CSS
CSS (Cascade Style Sheets): conjunto de reglas de formato que determinan el aspecto del contenido de una página Web.
El contenido de la página(código HTML) reside en archivo HTML
La presentación del código(reglas de formato) reside en archivo CSS
(o en el HEAD)
CSS
CSS (Cascade Style Seets): Más fácil mantener el aspecto del sitio desde una
ubicación central, no es necesario actualizar las propiedades de las distintas páginas.
Depura y simplifica el código HTML y disminuye el tiempo de carga.
Gran flexibilidad y control para lograr el aspecto exacto que desea para la página
CSS
Las Reglas CSS: Consta de: selector y declaración.
Selector: término (por ejemplo p, h1,un nombre de clase o un identificador) que identifica el elemento con formato.
Declaración, o bloque de declaraciones: define las propiedades de estilo.
Cada Declaración consta de: Propiedad y Valor
CSS
Las Reglas CSS:
h1 { font-size: 16
pixels; font-family:
Helvetica; font-weight:bold;
}
Bloques deDeclaraciones
Selector
Propiedad Valor
CSS
Hojas Estilos Externas:
CSS
Sintaxis en el documento HTML Declarados dentro del HTML
CSS
Sintaxis en el documento HTML Hoja de estilo vinculada
CSS
Sintaxis en el documento HTML Importados de una hoja de estilo
CSS
Los tipos de estilo Personalizados (clase): Similares a los de programas de edición de
texto. Añaden atributo “class” a las estiquetas. Etiquetas: Definen formatos a las etiquetas del HTML Selector (Avanzadas): Definen formato de la combinación de
etiqueta y atributo. Por ejemplo estados de un vínculo.
CSS
Introducción Concepto Cascada
1. Estilos Autor
2. Estilos Usuarios
3. Estilos Navegador Concepto Herencia:
Propiedades heredadas por los descendientes de elemetos:
Por ejemplo: tipografía en el elemento <body> se hereda a todos los otros elementos.
Body {color:black} √P, div, h1, h2, h3, ul, li {color:black} X
CSS
El Panel de Estilos de Dreamweaver: Crear una hoja estilos Crear, Modificar y Borrar Reglas de Estilo Ventanas para la Definición de Reglas
(las declaraciones de cada regla): Tipo Fondo Bloque Cuadro Borde Lista Posición Extensiones
CSS
Diseño con capas Float Clear Posición Absoluta Orden Apilamiento
Formatos con estilos: Listas Enlaces
CSS
Trucos con Fondos: Fondo de la web Cajas con esquinas redondeadas Cajas con Fondo Transparente
Consideraciones para el Diseño de Sitios de Contenido Dinámico Combinar capas con comportamientos.
CSS
RECURSOS:
CSS
RECURSOS: