13 Clase/ 5 de noviembre 2015/ Jueves --Exposiciones -Estructura del Cuerpo HTML 5 -CCS --Maquetación en Dreanweaver
EXPOSICIÓN DEL GRUPO 2 ¿Qué es CSS? CSS es un lenguaje de estilo que define la presentación de los documentos HTML. CSS es el acrónicmo de CascadingStyle Sheets (es decir, hojas de estilo en cascada Diferencia de CSS1, CSS2, CSS3 css1 fue la primera especificación, trató básicamente los estilos de texto, bordes, fuentes, etc. css2 brinda soporte a hojas de estilo específicas para cada medio, incluyó toda la parte de posicionamiento de cajas, (por ejemplo, fuentes, colores, espaciado, bordes, señales sonoras, etc.) Tal vez la mayor diferencia entre CSS2 y CSS3 está dividido en varios documentos llamados módulos. Cada módulo cuenta con nuevas capacidades, sin afectar la compatibilidad de la versión estable anterior
Por Que trabajar con hojas de estilo CSS Porque nos permite aplicar formato de estilos a los documentos escritos en HTML, Separando el contenido de las paginas de su apariencia. Entonces podemos decir que los estilos CSS sirve para organizar la presentación y aspecto de una pagina Web. Este lenguaje es principalmente utilizado por parte de los navegadores Web de Internet y por los programadores Web Informáticos para elegir multitud de opciones de presentación como colores, tipos , y tamaños de letra ,etc.
Donde usar estilos CSS Podemos usarlo en una página web porque así se muestra con el estilo visual que nos interese, podemos hacer que cada elemento de la página se represente en el navegador exactamente como estimemos, ya sea el orden, la posición, colores, etc. del texto el fondo las imágenes, o cualquier otro elemento que forme parte de la página. Cada página web viene con su estilo definido mediante CSS, si no se encuentran el navegador utiliza una configuración estándar predefinida. Los métodos usados habitualmente son tres:
Propiedades de Fondos CSS Las propiedades de fondo en CSS, nos permiten controlar el color de fondo de un elemento Si colocamos una imagen de fondo, la ubicación de la misma en la pantalla tiene que ser centrada
CSS FUENTE La propiedad font es la forma comprimida en la cual podemos definir todos los valores de las fuentes de una sola vez. Esta propiedad se aplica a todos los elementos. Sintaxis <head> <style="type:text/css"> selector {font: valor1 valor2 valor n} </style> </head> Nota: debemos dejar un espacio en blanco entre los valores. Los posibles valores para definir las fuentes Todos los valores de font-family | font-style | font-variant | font-weight | font-size | caption | icon | menu | message-box| small-caption | status-bar
EXPOSICIÓN DEL GRUPO 3 Section Aside Footer Article Hgroup Figure Estructura del Cuerpo HTML 5 Section Sirve para definir una sección o agrupación temática del contenido de una página web. Aside Representa una sección de una página que consiste en contenido que está tangencialmente relacionado con el contenido que le rodea Footer Etiqueta para encerrar todo aquel código típico de las partes inferiores Article Usada para representar un contenido específico de nuestra web Hgroup Define un grupo de cabeceras Figure Representa un Contenido Independiente Figcapture Permite poner fácilmente textos debajo de fotos EXPOSICIÓN DEL GRUPO 3
Maquetación en Dreanweaver para nuestra pagina. 1 Maquetación en Dreanweaver para nuestra pagina. 1. Creamos una carpeta y en esta crearemos subcarpetas que son IMÁGENES, JS, CSS 2.Abrimos un nuevo documento HTML 5, administrando el sitio que es nuestra carpeta.
3. Guardar como plantilla, para saber si esta bien guardado observamos en la parte superior del documento tiene qu salir “dwt”. Debe salir un cuadro amarillo para empezar a trabajarlo, como podemos observar. Debemos recordar dar clic en diseño para ver cambios y trabajar en la pagina.
4. Nos colocamos a Ventana-Propiedades de la pagina-Apariencia, escribimos 0,0,0,0 en margen izquierdo, margen derecho, margen superior y margen inferior como podemos observar, esto sirve para que el puntero de nuestra pagina este donde queramos ubicarla.
5. Creamos nuevos estilos y lo adjuntamos vinculándolo y para esto Creamos y guardamos un nuevo documento en Diseñador de CSS , sin olvidar e guardar todo, como lo podemos ver.
6. Vinculamos los estilos. 7. Colocamos el CUERPO, ENCABEZADO, CONTENIDO Y PIE DE PAGINA.
Debemos recordar que para cada parte debe tener un espacio prudencial para podernos guiar y no crear una etiqueta dentro de otra si no seguir dentro de la misma. Para saber si están dentro de la etiqueta damos clic en la etiqueta donde estamos trabajando, ejemplo:
Al final quedara así la carpeta de documentos de la pagina.