Qué es una hoja de estilo CSS

De seguro, hemos escuchado muchas veces sobre las famosas hojas de estilo CSS, ya que son muy utilizadas en diseño y programación web. Seguidamente, estaremos hablando sobre las hojas de estilo CSS, su origen, para qué se utilizan y cuál es su importancia dentro de la creación de páginas web.

Hojas de estilo CSS

Las hojas de estilo CSS u hojas de estilo en cascada, como también se les conoce, son líneas de código HTML o XML que están orientadas a darle un estilo específico a los elementos de un documento HTML, es decir, se utilizan para personalizar el color, los backgrounds, las fuentes, los enlaces y todo el apartado visual de un sitio web, con la finalidad de mantener lo más limpio posible el código fuente de la página web.

hojas de estilo CSS

Figura 1: Hoja de estilo CSS

Las hojas de estilo CSS actúan directamente sobre las etiquetas del código HTML e incluso, pueden actuar sobre etiquetas creadas por el mismo usuario o clases, como también se les puede llamar.

Las especificaciones de estas hojas de estilo han sido creadas por la W3C, pautando los estándares a ser utilizados por dichas hojas de estilo.

Hojas de estilo CSS

Figura 2: Hojas de estilo CSS

Tipos de hojas de estilo

Existen tres tipos diferentes de hojas de estilo:

  • Externas: Son archivos independientes de la página web. Llevan una extensión .css y son llamadas desde la cabecera del código de nuestro sitio web para poder cargar los estilos definidos.
  • Internas: Este tipo de hoja de estilo va adicionada dentro de la etiqueta <HEAD> del código de nuestro sitio web.
  • InLine: Estas hojas, son adicionadas directamente en la etiqueta, es decir, el estilo de la etiqueta es escrito dentro de ella.

Hojas de estilo CSS

Figura 3: Hojas de estilo CSS

Importancia de utilizar hojas de estilo CSS

Las hojas de estilo CSS han evolucionado por completo la manera de diagramar las páginas web, ya que han reemplazado totalmente el uso de tablas HTML para crear efectos o para organizar los elementos dentro del sitio. Las hojas de estilo nos permiten controlar de manera sencilla cada zona del sitio web, ofreciendo una comodidad absoluta al momento de realizar la diagramación del website.

Podemos decir entonces, que las hojas de estilo son una forma de depurar el código fuente y crear un estilo visual que realmente se ajuste a las necesidades, tanto del desarrollador como del usuario final del sitio web.