Las hojas de estilo CSS (Cascading Style Sheets) son conjuntos de instrucciones, a veces en forma de archivo de texto anexo, que se asocian a las páginas web y se ocupan del formato y presentación de los contenidos web, en lo referente a aspectos como fuente, tamaño de letra, justificación del texto, colores, fondos, bordes o disposición de objetos, entre otros.
Qué son las hojas de estilo CSS
Cuando nos referimos a CSS (Cascading Style Sheets, hojas de estilo en cascada), hacemos alusión al lenguaje utilizado para especificar el formato y aspecto de los documentos escritos en lenguaje de marcas. La idea básica que motiva el desarrollo de CSS es separar la estructura de un documento de su presentación.
Las hojas de estilo CSS son comúnmente utilizadas para dar estilo a sitios web escritos en lenguaje HTML, aunque también se aplica a documentos escritos en XML, SVG y XUL.
La sintaxis es sencilla, utiliza ciertas palabras clave del inglés que especifican los selectores, propiedades y atributos.
Una hoja de estilos CSS consiste en una serie de reglas compuestas por los siguientes componentes:
- Selectores: uno o más selectores que definen a qué elementos del documento se aplicarán los estilos.
- Bloque de estilos: se define entre llaves y está formado por una o varias declaraciones de estilo con el formato “propiedad:valor;”. Se aplican a los elementos del documento que cumplan con el selector que les precede.
- Declaraciones de estilo: se ubican dentro del bloque de estilo e indican el valor de cada propiedad o atributo.
Por ejemplo, para que las imágenes se muestren sin borde, la regla CSS sería:
img { border: 0; }
Respecto a la forma de emplear CSS, en los documentos HTML se puede utilizar de varias formas:
- Estilos en línea: se introducen las reglas CSS en el propio documento HTML, insertando el lenguaje de estilo en la propia etiqueta HTML.
- Hoja de estilos interna: se introducen las reglas CSS en el propio documento HTML, utilizando para ello la etiqueta <syle>.
- Hoja de estilos en archivo externo: se especifican las reglas CSS en un archivo externo, diferente al correspondiente al documento HTML.
- Estilos por defecto: son los que aplicará el navegador por defecto en ausencia de una declaración explícita de estilos. Para normalizar la visualización de una página web y que se vea igual en todos los navegadoes, los webmaster suelen colocar al inicio de la hoja de estilos una serie de reglas que resetean todos los posibles estilos por defecto.
Por lo que se refiere a las ventajas del uso de CSS, podemos citar varias:
- Se centraliza el control de la presentación de un sitio web.
- Se separa el contenido de la presentación del sitio, lo que permite realizar modificaciones por separado.
- Al poder definir varios estilos para un mismo selector, se optimiza el uso del ancho de banda.
- CSS resulta de mayor accesibilidad que herramientas anteriores.
El encargado de formular la especificación de las hojas de estilo que servirán de estándar para los navegadores es el W3C (World Wide Web Consortium), estando el desarrollo de CSS en la actualidad en su versión CSS3.