web123

Propiedades de las hojas de estilo

Propiedades de fuente
Propiedades de color y fondo
Propiedades de texto
Propiedades de bloque
Propiedades de clasificación
Unidades de medida

Propiedades de Fuente
Familia de fuente
Estilo de fuente
Variante de fuente
Peso de fuente
Tamaño de fuente
Fuente

Familia de fuente
Sintáxis:
font-family: nombre-familia |familia-genérica
Posibles valores:
nombre-familia
Cualquier nombre de familia. Como no todos los ordenadores tendrán las familias instaladas, se pueden poner varias alternativas separadas por comas
familia-genérica
serif (P.ej., Times)
sans-serif (P.ej., Arial or Helvetica)
cursive (P.ej., Zapf-Chancery)
fantasy (P.ej., Western)
monospace (P.ej., Courier)
Valor por defecto:
La fuente pordefecto
Se aplica a:
Todos los elementos
Ejemplo:
P { font-family: "New Century Schoolbook", Times, serif }
El tipo de fuente se puede cambiar también con la propiedad font .

Estilo de fuente
Sintáxis:
font-style: valor
Posibles valores:
normal | italic | oblique
Valor por defecto:
normal
Se aplica a:
Todos los elementos
Ejemplo:
H1 { font-style: oblique }

P { font-style:normal }


Variante de fuente
Sintáxis:
font-variant: valor
Posibles valores:
normal | small-caps
Valor por defecto:
normal
Se aplica a:
Todos los elementos
Ejemplo:
SPAN { font-variant: small-caps }
Permite especificar si la letra se verá normal o en versalita. Versiones posteriores de CSS permiten otras variantes, como: condensed, expanded, small-caps numeral, ...

Peso defuente
Sintáxis:
font-weight: valor
Posibles valores:
normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
Valor por defecto:
normal
Se aplica a:
Todos los elementos
Ejemplo:
H1 { font-weight: 800 }

P { font-weight: normal }

Tamaño de fuente
Sintáxis:
font-size: tamaño-absoluto | tamaño-relativo | longitud | porcentaje
Posibles valores:tamaño-absoluto
xx-small | x-small | small | medium | large | x-large | xx-large
tamaño-relativo
larger | smaller
longitud
porcentaje (en relación al elemento anterior)
Valor por defecto:
medium
Se aplica a:
Todos los elementos
Ejemplo:
H1 { font-size: large }

P { font-size: 12pt }

LI { font-size: 90% }

STRONG { font-size: larger }

Fuente
Sintáxis:font: valor
Posibles valores:
font-style || font-variant || font-weight || font-size /line-height || font-family
Valor por defecto:
Ninguno
Se aplica a:
Todos los elementos
Ejemplo:
P { font: italic bold 12pt/14pt Times, serif }
especifica un párrafo en negrita, cursiva, Times con un tamaño de 12 puntos y un interlineado de 14 puntos.
La propiedad font es una forma de abreviarpropiedades de fuente y de interlineado.

Propiedades de color y fondo
Color
Color de fondo
Imagen de fondo
Repetir fondo
Fondos añadidos
Posición del fondo
Fondos

Color
Sintáxis:
color: color
Valor por defecto:
Depende del navegador. Normalmente negro
Se aplica a:
Todos los elementos
Ejemplo:
H1 { color: blue }

H2 { color: #000080 }

H3 { color: #0c0 }
Para evitarproblemas conviene definirlo junto con el background.

Color de fondo
Sintáxis:
background-color: valor
Posibles valores:
color | transparent
Valor por defecto:
transparent
Se aplica a:
Todos los elementos
Ejemplo:
BODY { background-color: white }

H1 { background-color: #000080 }

Imagen de fondo
Sintáxis:
background-image: valor
Posibles valores:
url | none
Valor pordefecto:
ninguno
Se aplica a:
Todos los elementos
Ejemplo:
BODY { background-image: url(/images/foo.gif) }

P { background-image: url(http://www.htmlhelp.com/bg.png) }
Cuando se define una imagen de fondo conviene definir también un background color similar para que si se desactiva la carga de imágenes el texto siga pudiéndose leer.

Repetir fondo
Sintáxis:
background-repeat:...