|
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.
Artículo escrito por Alberto Gómez para HazUnaweb.com. Queda absolutamente prohibida su reproducción.
| 