Diseño web funcional: Hojas de estilo "CSS"
|
|
2º de Bachillerato
|
|
Tecnologías de la Información y Comunicación
|
|
Contenidos
|
|
Diseño web funcional:Hojas de estilo "CSS" |
![]() |
Imagen en Wikipedia de www. Licencia CC |
En un principio diseñar una página web consistía en unir todo tipo de etiquetas, mezclando el diseño de estructura con el formato, hoy en día la separación de la estructura de un documento (HTML) de su diseño o presentación (CSS) ofrece múltiples ventajas.
En el trimestre anterior estudiamos las etiquetas fundamentales de HTML, incluso estamos familiarizados con algunas etiquetas del nuevo estándar , el HTML5. ¿Sabemos ya diseñar un sitio web? Sólo parcialmente. En la actualidad ya no basta con manejar HTML para realizar estas tareas; necesitamos conocer también el estándar que lo complementa, CSS, acrónimo de hojas de estilo en cascada.
¿Qué aprenderemos en este tema? Crearemos nuestras propias CSS comprobando que efecto tiene tras vincularlas con páginas HTML. En el siguiente ejemplo observaremos cómo cambia una misma página HTML tras asociarla a diferentes CSS que definen cada una un estilo distinto. Para ver los efectos hace clic en las distintas hojas de estilo del menú, demoCss.

Para saber más
![]() |
Imagen en Wikipedia de Dayphre. Licencia CC |
HTML5 & CSS3
El uso de hojas de estilo es obligatorio en las páginas web creadas con HTML5, este estándar define la estructura de la página y el CSS el estilo y el diseño.
El navegador, a su vez, tomará cada una de las partes y las mezclará, dando el resultado deseado: una página con sentido semántico gracias a HTML y con una apariencia estética apropiada mediante el estilo CSS.
Las hojas de estilo han ido evolucionando desde la primera versión del estándar en el 2001. En la actualidad la versión 3 de este conjunto de normas está aún en desarrollo, pero la mayoría de los navegadores son capaces de ejecutar todas las propiedades principales de CSS3.