Propiedades de las fuentes en CSS

7. Propiedades de las fuentes
Las propiedades CSS de las fuentes son las que permiten controlar el tamaño, el tipo, el grosor o el estilo de las letras, entre otras cosas. En la siguiente tabla se muestran las propiedades de las fuentes más destacadas.
Propiedad | Descripción | Valores |
---|---|---|
font-family | Familias de fuentes | nombre-familia | * |
font-style | Estilo de la fuente | normal | italic | oblique |
font-variant | Convierte a mayúsculas manteniendo todas las letras en un tamaño inferior a la primera | normal | small-caps |
font-weight | Anchura de los caracteres. Normal = 400, Negrita = 700 | normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 |
font-size | Tamaño de la fuente | xx-small | x-small | small | medium | large | x-large | xx-large | larger | smaller | longitud | porcentaje |
7.1. Font-family
.a { font-family: "Times New Roman", Times, serif; } .b { font-family: Arial, Helvetica, sans-serif; }
0
7.2. Font-style
.a { font-style: normal; } .b { font-style: italic; } .c { font-style: oblique; }
La letra cursiva es una versión especial de la fuente, mientras que la letra oblicua es la versión normal de la fuente con una ligera inclinación.
0
7.3. Font-variant
.a { font-variant: normal; } .b { font-variant: small-caps; }
0
7.4. Font-weight
.a { font-weight: normal; } .b { font-weight: bold; } .c { font-weight: 600; }
0
7.5. Font-size
.a { font-size: 20px; } .b { font-size: 2em; } .c { font-size: xx-small; } .d { font-size: small; } .e { font-size: 250%; }
0
Test
¿Cómo se define el texto en negrita para todos los párrafos?
¡Bien!
¡Has fallado!
¿Cómo se indica que el estilo de la fuente es cursiva?
¡Bien!
¡Has fallado!
¿Cuál es la propiedad que nos permite indicar el tamaño del texto?
¡Bien!
¡Has fallado!
¿Qué propiedad nos permite cambiar el tipo de fuente de un texto?
¡Bien!
¡Has fallado!
Propiedades de las fuentes
¡Muy bien!
Sigue repasando...