Hay muchas maneras de cambiar el tamaño de la letra con el CCS.

Puedes cambiar el tamaño de las fuentes de tu página con la propiedad font-size. El los valores de la propiedad, sin embargo, puede ser un poco difícil. Echa un vistazo a estos valores para el tamaño de la fuente:

tamaño de letra: 200%;
tamaño de letra: 32px;
tamaño de letra: 2em;
tamaño de letra: xx-grande;

¡En realidad son del mismo tamaño! Pruébalos en tu código. Añade lo siguiente resaltado Estilo CSS:

Style sheet showing example of font size

Guarda tus cambios y actualiza la página en tu navegador. Deberías ver el párrafo del texto cambian de tamaño.

Ahora prueba los otros tres tamaños: 200%, 32px, y 2em. Deberías encontrar que ellos son todas del mismo tamaño (o lo suficientemente cercanas).

La que uses depende de ti. En los navegadores más antiguos, sin embargo, usando el fijo Los valores de tamaño de px y em significa que tus usuarios no podrán aumentar el tamaño de sus fuentes. Esto es importante para aquellos cuya vista no puede ser perfecto, y por lo tanto necesitan una fuente más grande al leer su texto. Pero los navegadores le permiten acercar y alejar el zoom manteniendo pulsada la tecla CTRL y pulsando + o -. (Se reinicia presionando CTRL y luego 0.) Así que los valores del tamaño de la fuente no son tan importantes. Muchos profesionales, sin embargo, establecerán el tamaño de fuente de la etiqueta BODY al 100%, entonces usa em como el valor. Así:

Style sheet showing example of multiple font sizes

Esto significa que todos los tamaños de fuente entre las dos etiquetas de BODY se establecen en el El tamaño predeterminado del navegador es del 100%. En píxeles, el tamaño por defecto de los navegadores es de 16px. Esto es igual a 1em. La etiqueta P de arriba establece el tamaño de la fuente a uno y medio veces el valor por defecto, mientras que la clase ChangeFontSize está estableciendo el tamaño de la fuente al doble del valor por defecto.

Los otros tamaños se usan raramente. Pero aquí están:

xx-small
x-small
small
medium
grande
x-grande
xx-grande
más pequeño
más grande

Pruébelos y vea qué pasa.

En la siguiente parte, aprenderás a estilizar las fuentes.

| Estilizar las fuentes |