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;
