Diseño con CSS

Definición

Hojas de estilo en cascada (o CSS, siglas en inglés de Cascading Stylesheets) es un lenguaje de diseño gráfico para definir y crear la presentación de un documento estructurado escrito en un lenguaje de marcado o más conocido como página web. Es muy usado para establecer el diseño visual de los documentos web, e interfaces de usuario escritas en HTML o XHTML.

Podemos decir que CSS realmente son dos lenguajes en uno.

  • Lenguaje de Selección: podemos escoger uno o varios elementos HTML.
  • Lenguaje de Atribución: añadimos propiedades de formato a estos elementos.

Introducción.

A medida que las páginas web ganaban popularidad y fue accesible a un mayor público se incrementó la demanda de textos ricos no sólo en contenido sino también en diseño. Se necesitaban herramientas que variasen el color, la forma y otros atributos visuales de los componentes que formaban la web.

Una primera solución la ofreció el propio lenguaje HTML, mediante la exposición de una serie de atributos de estilo, a nivel de etiqueta, esto es, incrustado como atributo dentro de los elementos HTML.

<body bgcolor=“blue”>

Pero había una serie de problemas que se hacían evidentes: los atributos eran insuficientes y había que agregar nuevos con lo que era necesaria una actualización también del propio lenguaje HTML. Además la variación del diseño de los documentos era muy costoso tanto en tiempo como en lo económico.

Es a finales de 1996 cuando se adopta un nuevo lenguaje, el CSS (Cascading style sheets). Inspirado en la regla de separación de funciones, el nuevo lenguaje asume la única tarea de controlar el aspecto (diseño) del documento, dejando la estructuración al ya conocido HTML. Aplicamos así pues la regla de separación de funciones.

Terminología

HTML
Estructuración
<p class="articulo">
  • <p class="articulo">: elemento
  • p: etiqueta
  • class: atributo
  • articulo: valor
CSS
Diseño
p{color:red;}
  • p{color:red;}: sentencia
  • p: selector -de elemento
  • color: propiedad
  • red: valor

REGLA DE SEPARACIÓN DE FUNCIONES

Divide tu tarea en varias, de acuerdo a la naturaleza del problema, de tal manera que te puedas concentrar en la solución de un aspecto por vez. Esta idea la desarrollaremos en las lecciones siguientes.

By Xurxo González Tenreiro

Informático de mente inquieta con grandes ideas en el ámbito de la progamación. Especialista en el desarrollo web e interesado en el análisis SEO. Me encanta mi labor en el ámbito de la divulgación por lo cual he ampliado mis horizontes al ámbito de la educación y formación en el desarrollo de aplicaciones web. También como gestor de contenidos web soy muy puntilloso con la divulgación y la elaboración de publicaciones en la red.

Leave a Reply

Your email address will not be published. Required fields are marked *


The reCAPTCHA verification period has expired. Please reload the page.

This site uses Akismet to reduce spam. Learn how your comment data is processed.