Visitor Analytics
Saltar al contenido principal
alt text
  • alt text
  • alt text
  • alt text

Cascading Style Sheets (CSS) (Hojas de Estilo en Cascada)

¿Qué son las Hojas de Estilo en Cascada?
¿Qué son las Hojas de Estilo en Cascada?

TL;DR

CSS trabaja junto con HTML y tiene la función de adaptar el contenido de las páginas web, de una manera visual, a través de múltiples dispositivos. Dicta el estilo separando fuentes, diseños, colores y otros elementos y mejora la experiencia del usuario.

Acerca de las hojas de estilo en cascada (CSS)

Hojas de estilo en cascada (CSS) trabaja junto con Hypertext Markup Language (HTML) para mejorar el diseño de páginas web. A través de CSS, los diseñadores web son capaces de configurar un estilo para una página y ese estilo se aplicará a todas las demás páginas y elementos de todo el sitio web. CSS se utiliza para hacer que los sitios se vean más atractivos y mejorar la experiencia del usuario.

¿Por qué es importante el CSS?

CSS permite a los desarrolladores especificar un estilo una vez y el navegador web aplicará ese mismo estilo específico muchas veces después en las páginas web o en el documento, por lo que es eficiente en el tiempo. Además, a través de este método, se establece un mayor control sobre el diseño, a la vez que se mejora la flexibilidad e interactividad del sitio web. CSS también facilita la actualización de sitios web, eliminando el estilo de codificación repetitiva de HTML básico, y tiene la ventaja de reducir el número de errores en el código, ya que las páginas web que utilizan CSS se cargan más rápido porque el navegador sólo tiene que descargar las reglas una vez y cachéarlas para cargar las demás páginas del sitio.

Un ejemplo de cómo funciona el CSS

El CSS funciona mediante la creación de reglas. Aquí hay un ejemplo simple de código CSS que define el color y el tamaño del H1: <style> H1 { font-size:20pt color:green;} </style> Ahora, con la anterior regla CSS en vigor, cualquier código HTML del sitio web que contenga el H1 se mostrará automáticamente en verde y de tipo 20 puntos: <html> <body> <h1>este encabezado es verde y 20 pt.</h1> </body> </html>

Las páginas web que usan CSS se cargan más rápido porque el navegador sólo tiene que descargar las reglas una vez y guardarlas en caché para cargar las otras páginas del sitio.

Un ejemplo de cómo funciona el CSS

El CSS funciona creando reglas. Aquí hay un ejemplo simple de código CSS que define el color y el tamaño de la H1: <estilo> H1 { tamaño de fuente:20pt color:verde;} </estilo> Ahora, con la regla CSS anterior en efecto, cualquier código HTML del sitio web que contenga la H1 se mostrará automáticamente en verde y con un tipo de 20 puntos: <html> <body> <h1>este encabezado es verde y 20 pt.</h1> </body> </html>