Fuente pequeña HTML

La publicación de hoy nos enseñará cómo mostrar fuentes pequeñas en HTML.

Mostrar fuentes pequeñas en HTML

La propiedad CSS font-size determina el tamaño de la fuente. Cuando se modifica el tamaño de fuente, también se modifican los tamaños de las unidades de longitud relativas al tamaño de fuente, como em, ex, etc.

El tamaño de la fuente se puede especificar de muchas maneras, incluido el uso de palabras clave o valores numéricos expresados en píxeles o ems. Seleccione el enfoque adecuado según los requisitos específicos de la página web.

Sintaxis:

font-size: value

Los trece valores que admite font-size se enumeran a continuación:

1. El valor predeterminado para el atributo tamaño de fuente es medio, lo que hace que el tamaño de fuente sea medio.
2. El tamaño de fuente se establece en un tamaño xx-pequeño por el valor xx-pequeño.
3. El valor x-pequeño reduce aún más el tamaño del texto.
4. El número pequeño reduce el tamaño del texto a pequeño.
5. El valor grande aumenta el tamaño del texto a un tamaño grande.
6. El tamaño de fuente se cambia a extra grande usando la opción x-grande.
7. El tamaño de fuente se establece en un tamaño doble extra grande por el valor xx-grande.
8. El tamaño de fuente se establece en un valor más pequeño, más pequeño que el elemento principal.
9. El número más grande aumenta el tamaño de la fuente por encima del elemento principal.
10. El valor de longitud establece un tamaño de letra fijo en píxeles, centímetros, etc.
11. El tamaño de fuente se establece en un porcentaje del tamaño de fuente del elemento principal utilizando el valor %.
12. El valor inicial establece el valor por defecto de este atributo.
13. El atributo Inherit es heredado por un elemento de su padre.

Más detalles sobre el tamaño de fuente están disponibles en la documentación oficial aquí.

Para comprender mejor el concepto anterior, considere el siguiente ejemplo.

<p style="font-size: medium;">Hello World!</p>
<p style="font-size: 5px;">Hello World!</p>
<p style="font-size: x-small;">Hello World!</p>
<p style="font-size: small;">Hello World!</p>
<p style="font-size: xx-small;">Hello World!</p>
<p style="font-size: xx-large;">Hello World!</p>
<p style="font-size: large;">Hello World!</p>

El ejemplo anterior imprime la frase hola mundo con diferentes tamaños de letra. Seleccione el enfoque adecuado según los requisitos específicos de la página web.