Tutorial CSS

Puede que ya hayas oído hablar de CSS sin saber realmente qué es. En esta
lección aprenderás más cosas sobre CSS y qué puede hacer por ti.
CSS es el acrónicmo de CascadingStyle Sheets (es decir, hojas de estilo en
cascada).

¿QUÉ PUEDO HACER CON CSS?
CSS es un lenguaje de estilo que define la presentación de los documentos HTML. Por
ejemplo, CSS abarca cuestiones relativas a fuentes,colores, márgenes, líneas, altura, anchura,
imágenes de fondo, posicionamiento avanzado y muchos otros temas. ¡Espera unos segundos
y ya verás!
Es posible usar HTML, o incluso abusar del mismo, para añadir formato a los sitios web. Sin
embargo, CSS ofrece más opciones y es más preciso y sofisticado. CSS está soportado por
todos los navegadores hoy día.
Después de unas cuantas lecciones de estetutorial serás capaz de crear tus propias hojas de
estilo usando CSS para dar a tu sitio web un aspecto nuevo y genial.

¿QUÉ DIFERENCIA HAY ENTRE CSS Y HTML?
HTML se usa para estructurar el contenido; CSS se usa para formatear el contenido
previamente estructurado.

Vale, suena un poco técnico y confuso... pero sigue leyendo; pronto todo tendrá sentido.
Allá en los buenos tiempos en queMadonna era una "Virgen" y un tipo llamado Tim Berners
Lee inventó el World Wide Web, el lenguaje HTML sólo se usaba para añadir estructura al
texto. Los autores podían marcar sus textos diciendo "esto en un título" o "esto es un párrafo",
usando las etiquetas HTML y , respectivamente.

A medida que la Web fue ganando popularidad, los diseñadores empezaron a buscar
posibilidades para añadirformato a los documentos en línea. Para satisfacer esta reclamación,
los fabricantes de los navegadores (en ese momento, Netscape y Microsoft) inventaron nuevas

Trabajo realizado por Néstor Javier Perdomo Cruz

etiquetas HTML, entre las que se encontraban, por ejemplo, , que se diferenciaba de las
etiquetas originales HTML en que definían el formato... y no la estructura.

Esto tambiénllevó a una situación en la que las etiquetas estructurales originales, por
ejemplo, , se usaban cada vez más de manera incorrecta para dar formato a las páginas
en vez de para añadir estructura al texto. Muchas nuevas etiquetas que añadían formato, por
ejemplo, , sólo las soportaban un tipo determinado de navegador. "Necesitas el
navegador X para visualizar esta página" se convirtió en unadeclaración de descargo común
en los sitios web.

CSS se inventó para remediar esta situación, proporcionando a los diseñadores web con
sofisticadas oportunidades de presentación soportadas por todos los navegadores. Al mismo
tiempo, la separación de la presentación de los documentos del contenido de los mismos, hace
que el mantenimiento del sitio sea mucho más fácil.

¿QUÉ BENEFICIOS ME OFRECECSS?
CSS fue toda una revolución en el mundo del diseño web. Entre los beneficios concretos de
CSS encontramos:


control de la presentación de muchos documentos desde una única hoja de estilo;



control más preciso de la presentación;



aplicación de diferentes presentaciones a diferentes tipos de medios (pantalla,
impresión, etc.);



numerosas técnicas avanzadas ysofisticadas.

En la siguiente lección examinaremos con más detenimiento cómo funciona realmente CSS y
cómo puedes iniciarte en su uso.

En esta lección aprenderás a crear tu primera hoja de estilo; conocerás el modelo básico de
CSS y qué código es necesario para usar CSS en un documento HTML.
Muchas de las propiedades que se usan en las hojas de estilo en cascada (CSS) son parecidas a
las deHTML. Así pues, si estás acostumbrado a usar HTML para cuestiones de presentación,
lo más probable es que reconozcas gran parte del código usado.

LA SINTAXIS BÁSICA DE CSS
Digamos que queremos un bonito color rojo como fondo de nuestra página web:


Usando HTML podríamos haberlo conseguido así:




Con CSS el mismo resultado puede lograrse así:
body {background-color: #FF0000;}...