Avanzada CSS Propiedades de fuente

Hay muchas propiedades CSS para usar en las hojas de estilo. Éstos son algunas de las características más populares de como usarlas.

Propiedades de la fuente

font-family – define la familia de fuentes que el texto debe mostrar en pulgadas (Nota: si el equipo que ve la página no tiene la fuente especificada, el navegador la intentará adivinar. Esto puede causar efectos extraños. Lo mejor es el uso normal  de fuentes, o fuentes genéricas.)

Para definir las familias específicas de la fuente, escribiremos los nombres de la familia en el orden que lo deseemos en la pantalla. Separe cada familia con una coma:

font-family: arial, ginebra, Helvetica, sans serif;

Para definir una familia de fuentes genéricas:

font-family: serif;

Las familias de fuentes genéricas incluidas en el sistema actual son:

  • Serif

font-family: serif;

  • Boton

font-family: sans-serif;

  • Monospace

font-family: espacio sencillo;

  • Cursiva

font-family: letra cursiva; ”

  • Fantasía

font-family: fantasy;

font-size - define el tamaño de la fuente. El tamaño de fuente puede ser especificado como un tamaño exacto, un tamaño relativo, con una longitud o un porcentaje (del espacio existente).

Para definir el tamaño exacto, simplemente especificar el tamaño en una de las siguientes medidas:

  • Ems

font-size: 13em;

  • Píxeles

font-size: 13px;

  • Picas

font-size: 13pc;

  • Puntos

font-size: 13pt;

  • pulgadas

font-size: 13IN;

  • centímetros

font-size: 13cm

  • milímetros

font-size: 13 mm

Hay siete tamaños estándar en los documentos HTML y XML, podemos definir su tipo de letra basado en los tamaños, así (texto estándar de tamaño medio):

  • Xx-small

font-size: xx-small;

  • X-small

font-size: x-small;

  • Pequeño

font-size: small;

  • Mediano

font-size: medio;

  • Grande

font-size: grande;

  • X-large

font-size: x-large;

  • Xx-large

font-size: xx-large;

Para definir el tamaño de letra en relación con el texto que lo rodea, podemos simplemente decir:

font-style - define si la fuente está en cursiva, oblicua, o normal.

  • Cursiva

font-style: italic;

  • Oblicua

font-style: oblicua;

  • Normal (por defecto)

font-style: normal;

font-variant - define si la fuente es normal o pequeña.

  • Small-caps

font-variant: small-caps;

  • Normal (por defecto)

font-variant: normal;

font-weight - define el grado de oscuridad o la luz del texto.

  • Negrita

font-weight: bold;

  • Audaz

font-weight: más audaces;

  • Más ligera

font-weight: más ligero;

  • 100

font-weight: 100;

  • 200

font-weight: 200;

  • 300

font-weight: 300;

  • 400

font-weight: 400;

  • 500

font-weight: 500;

  • 600

font-weight: 600;

  • 700

font-weight: 700;

  • 800

font-weight: 800;

  • 900

font-weight: 900;

  • Normal (por defecto)

font-weight: normal;

Dejar un comentario

*