font-size es un estilo que nos indica el tamaño de la fuente. Esta clase la explicaremos más adelante, en el artículo de estilos de fuente. Ahora lo que vamos a ver son las diferentes unidades de medida en CSS que podemos encontrar. Pixels: px
Las medidas se miden en pixels. Se escribe de la siguiente manera:
<div style="font-size:10px;">Texto de 10 pixels</div>
<div style="font-size:12px;">Texto de 12 pixels</div>
<div style="font-size:14px;">Texto de 14 pixels</div>
<div style="font-size:16px;">Texto de 16 pixels</div>
<div style="font-size:18px;">Texto de 18 pixels</div>
<div style="font-size:20px;">Texto de 20 pixels</div> |
Y aquí podemos ver el efecto de cada tamaño en el mismo texto:
Texto de 10 pixels Texto de 12 pixels Texto de 14 pixels Texto de 16 pixels Texto de 18 pixels Texto de 20 pixels |
Inches o pulgadas: in
Las medidas se miden en pulgadas. Se escribe de la siguiente manera:
<div style="font-size:0.2in;">Texto de 0.2 pulgadas</div>
<div style="font-size:0.3in;">Texto de 0.3 pulgadas</div>
<div style="font-size:0.4in;">Texto de 0.4 pulgadas</div>
<div style="font-size:0.5in;">Texto de 0.5 pulgadas</div> |
Y aquí podemos ver el efecto de cada tamaño en el mismo texto:
Texto de 0.2 pulgadas Texto de 0.3 pulgadas Texto de 0.4 pulgadas Texto de 0.5 pulgadas |
Milímetros: mm
Las medidas se miden en milímetros. Se escribe de la siguiente manera:
<div style="font-size:8mm;">Texto de 8 milímetros</div>
<div style="font-size:9mm;">Texto de 9 milímetros</div>
<div style="font-size:10mm;">Texto de 10 milímetros</div>
<div style="font-size:11mm;">Texto de 11 milímetros</div> |
Y aquí podemos ver el efecto de cada tamaño en el mismo texto:
Texto de 8 milímetros Texto de 9 milímetros Texto de 10 milímetros Texto de 11 milímetros |
Centímetros: cm
Las medidas se miden en centímetros. Se escribe de la siguiente manera:
<div style="font-size:0.5cm;">Texto de 0.5 centímetros</div>
<div style="font-size:1cm;">Texto de 1 centímetros</div>
<div style="font-size:1.2cm;">Texto de 1.2 centímetros</div> |
Y aquí podemos ver el efecto de cada tamaño en el mismo texto:
Texto de 0.5 centímetros Texto de 1 centímetros Texto de 1.2 centímetros |
Picas: pc
Las medidas se miden en picas. Se escribe de la siguiente manera:
<div style="font-size:1pc;">Texto de 1 picas</div>
<div style="font-size:2pc;">Texto de 2 picas</div>
<div style="font-size:3pc;">Texto de 3 picas</div>
<div style="font-size:4pc;">Texto de 4 picas</div> |
Y aquí podemos ver el efecto de cada tamaño en el mismo texto:
Texto de 1 picas Texto de 2 picas Texto de 3 picas Texto de 4 picas |
Puntos: pt
Las medidas se miden en puntos. Se escribe de la siguiente manera:
<div style="font-size:15pt;">Texto de 15 puntos</div>
<div style="font-size:20pt;">Texto de 20 puntos</div>
<div style="font-size:25pt;">Texto de 25 puntos</div>
<div style="font-size:30pt;">Texto de 30 puntos</div>
<div style="font-size:35pt;">Texto de 35 puntos</div> |
Y aquí podemos ver el efecto de cada tamaño en el mismo texto:
Texto de 15 puntos Texto de 20 puntos Texto de 25 puntos Texto de 30 puntos Texto de 35 puntos |
Existen dos tipos más que son em y ex.
| 
No hay comentarios:
Publicar un comentario