El órgano rector del web, el W3C, recomendó el uso de las CSS en diciembre de 1996 con la ratificación de la especificación Nivel 1 de CSS. El nivel 1 de CSS describía los atributos para usarse en las páginas HTML. Estos atributos reemplazaron la etiqueta font tradicional y otros marcadores de "estilo" como el color y los márgenes. En mayo de 1998, el W3C ratificó el nivel 2 de CSS que añadía capacidades adicionales a la especificación del nivel 1 e introdujo los atributos de posicionamiento. Estos atributos reemplazaron el uso incontrolado (e incorrecto) de la etiqueta table para diseñar la presentación de elementos de página. La revisión más reciente a las especificaciones CSS es CSS 2.1, que perfecciona algunos atributos y elimina otros que si acaso tenían algún uso en los navegadores actuales, era muy poco.
Las Hojas de Estilo (o CSS, por Cascading StyleSheets) son un mecanismo que permiten aplicar formato a los documentos escritos en HTML (y en otros lenguajes estructurados, como XML) separando el contenido de las páginas de su apariencia. Para el diseñador, esto significa que la información estará contenida en la página HTML, pero este archivo no debe definir cómo será visualizada esa información. Las indicaciones acerca de la composición visual del documento estarán especificadas en el archivo de la CSS.
La necesidad para las CSS y sus ventajas resultantes se pueden dividir en tres áreas principales: flexibilidad, reproducción y accesibilidad.

Flexibilidad

Al diseñar sus páginas utilizando una sola, o incluso varias, hojas de estilo externas, el diseñador puede aplicar esos cambios al sitio con sólo modificar la hoja de estilo y luego simplemente cargar la versión modificada.
Baste con imaginarse lo difícil que sería mover la navegación del sitio de la izquierda de la página a la derecha en un formato tradicional basado en tablas. Esto le llevaría horas de trabajo repetitivo y tedioso. Si, por el contrario, se hubiera escogido utilizar los atributos de posicionamiento de las CSS (conocidos como CSS-P) para diseñar esas páginas, un cambio sencillo al atributo "flote" o al atributo "position" en la hoja de estilo externa actualizaría la página. Y hay una ventaja adicional: se habrá actualizado todas las páginas que utilizan esa hoja de estilo ¡en todo el sitio!

Reproducción

Desde que la banda ancha se ha convertido en cosa de todos los días, muchos desarrolladores han dejado de considerar el tiempo que se necesita para reproducir una página en un navegador. Sin embargo, para muchos, es importante recordar que las audiencias a las que se dirigen los desarrolladores, todavía navegan en el web a través de una la línea telefónica. La disposición tradicional basada en tablas, es una de las causas principales de la carga lenta de las páginas. Esto sucede porque el navegador, una vez que recibe la página del servidor, debe primero examinar y "entender" la gama compleja de tablas anidadas. Primero tiene que ubicar la pieza de contenido que esté anidada más al fondo y luego ir para atrás en el código hasta alcanzar el contenedor que esté más arriba, la etiqueta de cuerpo body. Sólo una vez completado este trayecto es que el navegador puede comenzar a producir el contenido en la pantalla.
Cuando se usa las CSS, el navegador puede comenzar de inmediato el proceso de reproducción al recibir el contenido del servidor porque de haber, hay muy poca marcación de presentación en la página.
También hay una ventaja de reproducción oculta cuando se utilizan hojas de estilo externas. En el modo tradicional basado en tablas, los navegadores deben recuperar, analizar y reproducir cada página individualmente. En otras palabras, el navegador trabaja igual de duro para el despliegue de la página número 30 del sitio que para la primera página.
No obstante, si el sitio utiliza hojas de estilo externas para su presentación, la primera página del sitio incita al navegador a guardar en la memoria caché los archivos de hojas de estilo vinculados que utiliza la página. Esto quiere decir que todas las páginas subsiguientes en el sitio que utilicen esas hojas de estilo se van a cargar aun más rápido puesto que el navegador ya tendrá dichas hojas de estilo en caché.

Accesibilidad

Mucho se habla de la accesibilidad hoy en día. La mayoría de los desarrolladores saben que deberían estar pensando en crear sitios más accesibles, pero, en gran medida, sólo los desarrolladores que tienen que crear sitios para instituciones gubernamentales o educativas se han visto forzados a hacerlo. Al pensar en la accesibilidad, la gran mayoría de los desarrolladores piensan que sólo es cuestión de añadir cosas como atributos alt a las imágenes. Pero es eso y mucho más, y las CSS pueden facilitarle el trabajo de crear sitios accesibles.
Uno de los principales problemas de la accesibilidad, y para el cual las CSS pueden realmente marcar una diferencia, es en cómo la tecnología de asistencia como un lector de pantalla "lee" una página. En el mundo tradicional basado en tablas, un lector de pantalla se enfrenta a un desafío indecible de saber cómo leer una página. Piense lo confuso que sería para un lector de pantalla que se encuentra con una tabla profundamente anidada: ¿lee el contenido, o se lo salta? Y si se lo salta, ¿cómo regresa al contenido más tarde?
Al ver una página, es posible ubicar rápidamente el contenido de la página que le interesa al usuario e ignorar la navegación u otro contenido en la parte superior de la página. Una persona con dificultades visuales no se puede dar ese lujo. Tiene que esperar que el lector de pantalla analice sintácticamente toda la información superflua entre la parte superior de la página y el contenido que sí le interesa.
Con las CSS y su falta de marcación de presentación, lo único que el lector de pantalla encuentra es el propio contenido. Además, al diseñar con CSS-P, comenzará a concentrarse en el "flujo" del contenido en sí. Y comienza a considerar el orden lógico en la página.

Cómo funcionan

Las Hoja de Estilo no utilizan el archivo de la página Web para especificar el formato de la página (en realidad, a veces pueden hacerlo) como lo hace el código HTML. En su lugar, usan un archivo de texto puro con extensión .CSS que luego se vincula a la página.
Este archivo contiene reglas que constan de un selector (en este ejemplo de abajo, H1) y una o más declaraciones (en el ejemplo se tienen cuatro declaraciones). Cada declaración tiene dos partes: una propiedad (por ejemplo, FONT SIZE) y un valor (en este caso, 19pt). Estas reglas son las que determinan cómo deberá mostrarse la página.
Si se quisiera componer los encabezados H1 con tipografía Arial, de 19 puntos, en color azul y alineación central, el archivo CSS debería contener el siguiente texto:

Luego, en cada página del sitio en cuestión se agrega un link a la Hoja de Estilo:

El elemento LINK especifica:

• el tipo de vínculo: a una hoja de estilo ("stylesheet")
• la ubicación de la hoja de estilo a través del atributo "href"
• el tipo de hoja de estilo que se vincula: "text/css"

Ahora, todos los encabezado H1 de las páginas que contienen la referencia al archivo de la CSS tendrán el aspecto que hemos definido.

Ventajas (y desventajas) de las Hojas de Estilo

• Con una Hoja de Estilo es posible alterar la presentación de cada elemento sin tocar el código HTML, ahorrando esfuerzo y tiempo de edición. Si se quiesiera alinear a la izquierda los encabezados H1 de las páginas, bastaría con cambiar en la CSS la declaración "text-align: center" por "text-align: left" e inmediatamente cada H1 se alinearía a la izquierda en todas las páginas vinculadas a la Hoja de Estilo. De este modo no sólo se simplifica el mantenimiento del sitio sino que además se reduce las posibilidade de cometer errores.
• El lenguaje de las CSS ofrece herramientas de composición más potentes que HTML. Se puede, por ehjemplo, especificar una fuente alternativa genérica (Sans-serif) para el caso de que la máquina del usuario no contenga la Arial (en HTML no existen estas fuentes genéricas). Con HTML, el tamaño de la fuente se especifica con un sistema de medidas predeterminadas por el browser (en el ejemplo, SIZE=5), con las CSS se puede especificar el tamaño en puntos tipográficos (y es posible hacerlo en cm, pixeles, cuadratines, altura de la x, etc.). Más aún, las CSS permiten aplicar prácticamente todas las propiedades a cualquier elemento de la página, mientras que HTML sólo permite un número limitado de propiedades para cada elemento.
• Se evita tener que recurrir a trucos para conseguir algunos efectos. Con CSS no es necesario usar imágenes invisibles para hacer una sangría (la propiedad text-indent se encarga de eso) o usar una tabla para ubicar un elemento en determinado lugar de la pantalla (las CSS permiten posicionar con precisión cualquier elemento).
• El lenguaje de las Hojas de Estilo, aunque muy potente, es relativamente sencillo y fácil de aprender.
• Los documentos que usan CSS generalmente resultan más compactos.
• Pueden usarse con otros lenguajes de programación (como JavaScript) para conseguir efectos dinámicos en las páginas.

En cuanto a las desventajas en el uso de las Hojas de Estilo, la única de importancia es el soporte irregular que tienen las CSS por parte de los navegadores. Ciertas propiedades que funcionan en un browser no funcionan en otros, o existen diferencias en un mismo navegador según sea para Windows o Mac. También existen diferencias entre distintas versiones de un mismo browser.
Esto puede provocar que:

• Nuestra página sea visualizada por el lector con un formato no deseado por nosotros. En todo caso, el navegador aplicará el formato predeterminado y nuestro trabajo de composición habrá sido inútil.
• Algunas propiedades de las CSS (como las que afectan la posición o visibilidad de los elementos) pueden provocar que una parte del contenido de nuestra página resulte inaccesible desde ciertos navegadores si no son utilizadas correctamente.

Debe entenderse que las Hojas de Estilo fueron diseñadas para permitir que los autores influyan en la composición de la página, pero no para que la controlen. Una CSS sugiere al browser un estilo de composición para el documento pero no puede forzarlo a aplicar un formato determinado.