Acerca del Web Design Group

Tutor rápido CSS


Una hoja de estilo está compuesta de reglas de estilo que le dicen a un navegador como mostrar un documento. Hay varias formas de enlazar estas reglas de estilo a sus documentos HTML, pero la forma más sencilla para comenzar es usar el elemento STYLE de HTML. Este elemento se coloca en la cabecera HEAD del documento y contiene las reglas de estilo para la página.

Note que aunque el elemento STYLE es un buen método de experimentar con hojas de estilo, tiene desventajas que deberían tenerse en cuenta antes de usarlo en la práctica. Las ventajas y desventajas de los varios métodos se discuten en la seccion sobre enlaces de hojas de estilo con HTML.

Cada regla está compuesta de un selector --usualmente un elemento HTML como BODY, P, o EM --y el estilo a ser aplicado al selector.

Hay muchas propiedades que pueden definirse para un elemento. Cada propiedad toma un valor, que junto con la propiedad describen como debería mostrarse el selector.

Las reglas de estilo se forman así:

selector { propiedad: valor }

Pueden separarse múltiples declaraciones de estilo para un solo selector con dos puntos :

selector { propiedad1: valor1; propiedad2: valor2 }

Como un ejemplo, el siguiente segmento de código define las propiedades color y font-size para los elementos H1 y H2:

<HEAD>
<TITLE>Ejemplo CSS</TITLE>
<STYLE TYPE="text/css">
  H1 { font-size: x-large; color: red }
  H2 { font-size: large; color: blue }
</STYLE>
</HEAD>

La hoja de estilo de arriba le dice al navegador que muestre los encabezados de nivel 1 con una fuente extra-grande y roja, y los de nivel 2 con una fuente grande, azul. La especiicación CSS1 define formalmente todas las propiedades y valores disponibles. Las propiedades y valores también son dadas en la sección propiedades CSS.

Este tutor pretende ser una introducción muy básica a las hojas de estilo en cascada, y debería brindarle suficiente información para permitirle experimentar con unos cuantos de sus propios estilos. Para una revisión más profunda de las hojas de estilo en cascada, lea las siguientes secciones:


Mantenido por John Pozadzides y Liam Quinn


Web Design Group ~ ÍndiceCSS ~ Estructura CSS ~ Propiedades CSS

Copyright © 1997-98 John Pozadzides y Liam Quinn. Todos los derechos reservados.