1
00:00:00,526 --> 00:00:03,685
También podemos usar CSS para cambiar el tamaño de nuestro texto.

2
00:00:03,685 --> 00:00:06,564
Como te puedes dar cuenta, simplemente mirando los encabezados de esta página

3
00:00:06,564 --> 00:00:09,357
comparados con los párrafos, el navegador ofrece

4
00:00:09,357 --> 00:00:12,212
estilos predeterminados con diferentes tamaños para los distintos elementos.

5
00:00:12,212 --> 00:00:13,643
Hay un tamaño de fuente para el cuerpo del texto,

6
00:00:13,643 --> 00:00:16,136
y tamaños mayores para cada nivel de encabezado.

7
00:00:16,136 --> 00:00:18,777
Aunque a veces queremos modificar esos tamaños.

8
00:00:18,777 --> 00:00:22,206
Y podemos hacerlo mediante la propiedad "font-size" de CSS.

9
00:00:22,419 --> 00:00:23,853
Por ejemplo:

10
00:00:23,853 --> 00:00:28,643
¿Qué hacemos si queremos que todo el texto de nuestra página sea un poco más pequeño?

11
00:00:28,948 --> 00:00:31,112
Bueno, vamos a la etiqueta de estilo,

12
00:00:31,112 --> 00:00:34,590
y añadimos una regla de CSS para la etiqueta "".

13
00:00:34,889 --> 00:00:39,337
Y luego dentro de esa etiqueta ponemos la propiedad "font-size".

14
00:00:39,337 --> 00:00:42,669
Ahora, ¿cuál debería ser el tamaño para "font-size"?

15
00:00:42,959 --> 00:00:45,924
¿Cómo medimos el tamaño de la fuente?

16
00:00:45,930 --> 00:00:47,954
En realidad, ésta es una buena pregunta,

17
00:00:47,954 --> 00:00:50,267
porque al menos tenemos 10 unidades diferentes

18
00:00:50,267 --> 00:00:52,588
que CSS puede reconocer para "font-size".

19
00:00:52,588 --> 00:00:55,674
Vamos a empezar con una unidad que ya hemos visto antes: pixeles.

20
00:00:55,853 --> 00:00:58,623
Usamos pixeles para decidir qué tan grandes queremos que sean nuestras imágenes.

21
00:00:58,623 --> 00:01:01,273
Y los seguiremos usando mucho en CSS.

22
00:01:01,286 --> 00:01:03,225
Probemos con 11 pixeles.

23
00:01:03,800 --> 00:01:06,145
Ah, todo se volvió más pequeño.

24
00:01:06,405 --> 00:01:08,920
En realidad, hasta el encabezado se volvió más pequeño.

25
00:01:08,920 --> 00:01:11,372
¿Por qué los encabezados se volvieron más pequeños también?

26
00:01:11,372 --> 00:01:15,516
¿No deberían ser del tamaño que el navegador determinó antes para los encabezados?

27
00:01:15,516 --> 00:01:16,428
No.

28
00:01:16,432 --> 00:01:21,954
Porque el estilo predeterminado de los encabezados del navegador no está especificado con pixeles.

29
00:01:21,962 --> 00:01:25,207
Está determinado usando una unidad diferente llamada "em".

30
00:01:25,495 --> 00:01:27,450
Y esa es una unidad relativa

31
00:01:27,450 --> 00:01:31,845
que hace que el tamaño de la fuente de los encabezados sea proporcional a la fuente del cuerpo del texto.

32
00:01:32,009 --> 00:01:34,077
Déjenme explicar lo que quiero decir con esto.

33
00:01:34,077 --> 00:01:36,439
Vamos a la regla de estilo de ""

34
00:01:36,574 --> 00:01:39,434
y agregar la propiedad "font-size".

35
00:01:39,446 --> 00:01:44,489
Esta vez, en lugar de pensar en pixeles, voy a pensar relativamente.

36
00:01:44,701 --> 00:01:50,193
¿Qué tan grande queremos que sea "" comparado con el cuerpo del texto?

37
00:01:50,193 --> 00:01:53,145
Tal vez, ¿al doble?

38
00:01:53,145 --> 00:01:56,763
Para eso , escribimos "2em".

39
00:01:56,992 --> 00:02:00,171
Lo que sucede ahora es que el navegador calcula

40
00:02:00,171 --> 00:02:01,818
el tamaño en pixeles para la fuente.

41
00:02:01,818 --> 00:02:05,048
El navegador sabe que el tamaño de la fuente del cuerpo del texto es de 11 pixeles.

42
00:02:05,048 --> 00:02:08,055
Y le dijimos que "" debería ser el doble del tamaño,

43
00:02:08,055 --> 00:02:12,144
así que ahora los encabezados en "" son de 22 pixeles.

44
00:02:12,144 --> 00:02:16,576
Si cambiamos el tamaño de la fuente del cuerpo del texto a 12 pixeles,

45
00:02:16,576 --> 00:02:18,932
entonces ¿de qué tamaño será ""?

46
00:02:19,267 --> 00:02:21,914
Es correcto, 24 pixeles.

47
00:02:21,914 --> 00:02:26,345
¿Qué pasa si cambiamos el tamaño de "" a 1.5em?

48
00:02:26,760 --> 00:02:30,805
Ahora "" será 12 por 1.5,

49
00:02:31,023 --> 00:02:32,666
que es 18 pixeles.

50
00:02:33,273 --> 00:02:37,754
También podemos especificar el tamaño en pixeles para "" como lo hicimos en "",

51
00:02:37,754 --> 00:02:39,521
y funciona de la misma manera.

52
00:02:39,634 --> 00:02:41,502
Depende de lo que te parezca más fácil.

53
00:02:41,502 --> 00:02:45,258
Y como lo mencioné antes, hay muchas unidades más que podríamos usar

54
00:02:45,258 --> 00:02:47,242
además de pixeles y "em".

55
00:02:47,242 --> 00:02:49,568
Éstas son sólo dos de las unidades más populares.

56
00:02:49,568 --> 00:02:51,016
Pero si quieres saber más,

57
00:02:51,016 --> 00:02:53,193
revisa la documentación de "font-size",

58
00:02:53,193 --> 00:02:55,402
o busca otros tutoriales en Internet.

59
00:02:55,422 --> 00:02:59,492
¡Es hora de que aproveches el "font-size"!