Hojas de estilo
CSS es el lenguaje de hojas de estilo creado para controlar el aspecto y la presentación de las
páginas Web. Es imprescindible para la creación de páginas Web complejas.
Este lenguaje separa la definición de los contenidos y la definición de su aspecto. Esto hace que
mejore la validación de los documentos HTML y XHTML ya que mejora la accesibilidad, reduce la
complejidad del mantenimiento y permite visualizar el mismo documento en infinidad de
dispositivos diferentes.
CSS3 es el estándar más reciente de las versiones anteriores de CSS (CSS2). Las hojas de estilo en
cascada, nivel 1 (CSS1) salieron del W3C como recomendación en diciembre de 1996. Esta versión
describe el lenguaje CSS, así como un modelo de formato visual simple para todas las etiquetas
HTML.
CSS2 se convirtió en una recomendación del W3C en mayo de 1998 y se basa en CSS1. Esta
versión agrega soporte para hojas de estilo específicas para medios, por ejemplo, impresoras y
dispositivos auditivos, fuentes descargables, posicionamiento de elementos y tablas.
CSS3 se convirtió en una recomendación del W3C en junio de 1999 y se basa en versiones
anteriores de CSS. Se ha dividido en documentación que se llama Módulos y aquí cada módulo
tiene nuevas características de extensión definidas en CSS2.
La última especificación de CSS se puede encontrar en la siguiente url:
[Link]
Antes de CSS, los diseñadores de páginas Web debían usar etiquetas, donde se especificaba el color,
tamaño y tipo de letra que queríamos. El problema de utilizar esta manera de definir el aspecto es
que si la Web tiene “x” elementos, tendríamos que definir “x” etiquetas y cada etiqueta tendría que
tener sus atributos.
Es habitual que con el avance en los diseños haya que cambiar constantemente la Web, por lo que es
una operación muy costosa tener que cambiar cada una de nuestras etiquetas, cada “x” tiempo.
CSS separa el contenido de su aspecto, esto supone un cambio importante, ya que con un mismo
estilo sin apenas esfuerzo y sobre todo sin ensuciar el código HMTL, se pueden cambiar el aspecto
de la página ahorrándonos etiquetas como <font> y haciendo que tenga el mismo aspecto que si las
tuviera.
¿Cómo incluir CSS en la Web?
CSS es muy flexible y permite varias opciones para realizar la misma tarea, existen tres opciones
para incluir CSS en una Web.
Incluir CSS en el mismo documento
Los estilos definen una zona específica de un documento. Se emplea la etiqueta <style> de HTML
para incluir código CSS en la cabecera de nuestro documento.
Es método se utiliza cuando no disponemos de mucho código CSS y cuando solo se le aplica a una
página determinada. El inconveniente de incluir así código CSS, es que si tenemos que modificar
algo del código, tendremos que cambiarlo en todas las páginas que le hayamos puesto este código.
Definir CSS en un archivo externo
Si queremos enlazar estilos CSS desde un archivo de externo, tendríamos que enlazar desde la
etiqueta <link>. El archivo CSS se crea simplemente guardando un archivo de texto pero con
extensión (.css). Como vemos desde el programa Notepad++, podremos hacer esto.
Aunque lo normal es enlazar con la etiqueta link, también podemos utilizar la etiqueta
<style>. Para indicar ahora la url de donde se encuentra nuestro estilo deberemos poner
@import url.
Incluir CSS en los elementos HMTL
También tenemos la opción de incluir los estilos CSS en los elementos del documento
HTML. Es la peor opción y la menos utilizada, ya que esta opción es casi como si
utilizáramos la etiqueta obsoleta <font>, solo se utiliza en determinadas situaciones en
las que se tienen que incluir un estilo muy específico.