¿Qué es CSS?

Aprender Introducción breve a las hojas de estilos CSS, como es que se utiliza, que efectos producen en la visualización de los documentos HTML y cuales son lo beneficios de utilizar CSS

¿Qué es CSS?

  • CSS significa Hojas de Estilos en Cascada (Cascading Style Sheets).
  • CSS describe como los elemento HTML deben de mostrarse en la pantalla, impresión o alguna media.
  • CSS ahorra mucho trabajo. Se puede controlar toda la presentación de varias páginas web desde un solo documento.
  • Las hojas de estilo externas se almacenan en archivos CSS.

Entonces, el CSS no es realmente un lenguaje de programación, tampoco es un lenguaje de marcado. Es realidad es un lenguaje de hojas de estilo, es decir, te permite aplicar estilos de manera selectiva a elementos de un documentos HTM.

Por ejemplo, para seleccionar todos los elementos de párrafo en una página HTML y volver el texto dentro de ellos de color rojo, de debe escribir el siguiente código:

CSS:

p {
color: red;
}

HTML:

<p>Un primer párrafo como muestra</p>
<ul>
<li>Un elemento de lista</li>
<li>Otro elemento de lista</li>
</ul>
<p>Un segundo párrafo como muestra también</ul>

Muestra:

Un primer párrafo como muestra

  • Un elemento de lista
  • Otro elemento de lista

Un segundo párrafo como muestra también

¿Para qué se utiliza el CSS?

Actualmente la creación de Sitios Web ha ido evolucionando con diferentes tecnologías para lograr sitios web sofisticados. Y los estilos en cascada CSS son la solución para establecer el diseño visual por separado del contenido web. Así la función principal del CSS es dar los estilos visuales a los Documentos web, incluyendo el diseño, plantillas, maquetación, ajustes para mostrarse en diferentes dispositivos y con diferentes tamaños y/o resoluciones de pantalla.

Antecedentes

Cuando se creo el HTML, nunca fue la intención de que este, le diera formato a las Páginas Web. El HTML fue creado para describir el contenido de una página web:

<h1>Esto es un encabezado</h1>
<p>Esto es un Párrafo</p>

Así, cuando las etiquetas como <font> y el atributo de color fueron agregados en la especificación HTML 3.2, comenzó una pesadilla para los desarrolladores web. Y en el desarrollo de grandes sitios web en donde ser requerían diferentes visualizaciones de tipos de letra y/o color en sus  diferentes secciones y/o páginas, esto lo convirtió en un proceso largo y costoso.

CSS resolvió un gran problema

Para resolver este problema, el World Wide Web Consortium (W3C) creo CSS. CSS fue creado para especificar los estilos del documento, no su contenido. A partir de HTML 4.0, todo el formateo se retiro del documento HTML y se almaceno en archivos CSS por separado.

A partir de HTML 4.0, todo el formateo se retiro del documento HTML y se almaceno en archivos CSS por separado.

¡CSS ahorra mucho trabajo!

La definición de los estilos son normalmente guardados en archivos CSS externos. Con un archivo externo de hoja de estilos, es posible cambiar el aspecto de un sitio web entero cambiando solamente este archivo.