Sie sind auf Seite 1von 10

INTRODUCCION

CSS

Qu es CSS
CSS es un lenguaje de hojas de estilos creado para controlar el
aspecto o presentacin de los documentos electrnicos
definidos con HTML y XHTML. CSS.
Es la mejor forma de separar los contenidos y su presentacin
y es imprescindible para crear pginas web complejas.
Al crear una pgina web, se utiliza en primer lugar el lenguaje
HTML/XHTML para marcar los contenidos, es decir, para
designar la funcin de cada elemento dentro de la pgina:
prrafo, titular, texto destacado, tabla, lista de elementos, etc.
Una vez creados los contenidos, se utiliza el lenguaje CSS para
definir el aspecto de cada elemento: color, tamao y tipo de
letra del texto, separacin horizontal y vertical entre
elementos, posicin de cada elemento dentro de la pgina,
etc.

Significado de la sigla CSS

Cascade
Style
Sheet
Hoja de estilo en cascada

Breve historia de CSS


Las hojas de estilos aparecieron poco despus que el
lenguaje de etiquetas SGML, alrededor del ao 1970. Desde
la creacin de SGML, se observ la necesidad de definir un
mecanismo que permitiera aplicar de forma consistente
diferentes estilos a los documentos electrnicos.
El gran impulso de los lenguajes de hojas de estilos se
produjo con el boom de Internet y el crecimiento exponencial
del lenguaje HTML para la creacin de documentos
electrnicos. La guerra de navegadores y la falta de un
estndar para la definicin de los estilos dificultaban la
creacin de documentos con la misma apariencia en
diferentes navegadores.
El organismo W3C (http://www.w3.org/) (World Wide Web
Consortium), encargado de crear todos los estndares
relacionados con la web, propuso la creacin de un lenguaje
de hojas de estilos especfico para el lenguaje HTML y se

La propuesta CHSS fue realizada por Hkon Wium Lie y SSP fue
propuesto por Bert Bos. Entre finales de 1994 y 1995 Lie y Bos se
unieron para definir un nuevo lenguaje que tomaba lo mejor de
cada propuesta y lo llamaron CSS (Cascading Style Sheets).
En 1995, el W3C decidi apostar por el desarrollo y
estandarizacin de CSS y lo aadi a su grupo de trabajo de HTML.
A finales de 1996, el W3C public la primera recomendacin
oficial, conocida como "CSS nivel 1".
El 12 de Mayo de 1998, el grupo de trabajo de CSS publica su
segunda recomendacin oficial, conocida como "CSS nivel 2.
En el ao 2007, apareci la versin CCS3 de Hojas de Estilo,
conjuntamente con una nueva versin del lenguaje de etiquetas
HTML5.
En el 2011, se ha lanzado el primer borrador de CSS4, se est
preparando versiones definitivas del lenguaje de etiquetas de
estilo CCS4.

SOPORTE DE CSS EN NAVEGADORES


El trabajo del diseador web siempre est limitado por las
posibilidades de los navegadores que utilizan los usuarios para
acceder a sus pginas. Por este motivo es imprescindible
conocer el soporte de CSS en cada uno de los navegadores ms
utilizados del mercado.

Los navegadores Safari y Opera son los ms avanzados en el


soporte de CSS, ya que incluyen muchos elementos de la futura
versin CSS 3 y un soporte casi perfecto de la actual version 2.1.
El navegador Firefox no tiene un soporte tan avanzado de CSS 3
pero las ltimas versiones estn alcanzando rpidamente a Safari

Estructura bsica de
CSS
CSS define una serie de trminos que permiten describir cada
una de las partes que componen los estilos CSS. El siguiente
esquema muestra las partes que forman un estilo CSS muy
bsico:

Los diferentes trminos se definen a continuacin:


Regla: cada uno de los estilos que componen una hoja de estilos
CSS. Cada regla est compuesta de una parte de "selectores", un
smbolo de "llave de apertura" ({), otra parte denominada
"declaracin" y por ltimo, un smbolo de "llave de cierre" (}).
Selector: indica el elemento o elementos HTML a los que se aplica
la regla CSS.
Declaracin: especifica los estilos que se aplican a los elementos.
Est compuesta por una o ms propiedades CSS.
Propiedad: permite modificar el aspecto de una caracterstica del
elemento.

Un archivo CSS puede contener infinitas reglas CSS, cada regla


puede contener infinitos selectores y cada declaracin puede
estar formada por un nmero infinito de pares propiedad/valor.
Digamos que queremos un bonito color rojo como fondo de
nuestra pgina web:
Usando HTML podramos haberlo conseguido as:
<body bgcolor="#FF0000">
Con CSS el mismo resultado puede lograrse as:
body {background-color: #FF0000;}
El cdigo usado es idntico para HTML y CSS. El ejemplo
anterior muestra adems el modelo CSS fundamental:

Aplicando CSS a Documentos HTML


Podemos aplicar CSS a un documento HTML de tres maneras
diferentes.
Mtodo 1: En lnea (el atributo style)
Un modo de aplicar CSS a HTML es usando el atributo de HTML
style.
<html>
<head>
<title>Ejemplo</title>
</head>
<body style="background-color: #FF0000;">
<p>Esta es una pgina con fondo rojo</p>
</body>
</html>
Mtodo 2: Interno (la etiqueta style)
Otra forma es incluir el cdigo CSS usando la etiqueta HTML
<style>.
<html>
<head>
<title>Ejemplo</title>
<style type="text/css">
body {background-color: #FF0000;}
</style>
</head>
<body>

Mtodo 3: Externo (enlace a una hoja de estilo)


El mtodo recomendado es enlazar con lo que se denomina
hoja de estilo externa. Una hoja de estilo externa es
sencillamente un fichero de texto con la extensin .css. Como
cualquier otro fichero, puedes colocar la hoja de estilo en el
servidor web o en el disco duro.
Por ejemplo, digamos que tu hoja de estilo se llama style.css y
est localizada en una carpeta que se llama estilos.
El truco consiste en crear un vnculo desde el documento HTML
(por ejemplo, default.htm) con la hoja de estilo (style.css).
Dicho vnculo se puede crear con una sencilla lnea de cdigo
HTML:
<link rel="stylesheet" type="text/css"
href="style/style.css" />
La etiqueta <LINK> le indica al navegador que debe buscar un
documento situado fuera de la pgina HTML.
El atributo rel="stylesheet" especifica que el documento en
cuestin es una hoja de estilo externa.
El atributo type="text/css" especifica el tipo de hoja de estilo.
El atributo href=" URL " muestra la URL de la hoja de estilo

Das könnte Ihnen auch gefallen