En Hojas de estilo en cascada (CSS), La propiedad del tamaño de la fuente posee una gran importancia. Asegura que el texto se destaque y enriquece la hoja con una jerarquía visual. La jerarquía ayuda a distinguir los encabezados y los subtítulos del texto normal. La propiedad del tamaño de fuente CSS utiliza unidades de tamaño múltiple como Píxeles, EM, ancho y valores porcentuales. Además, también utiliza diferentes encabezados que van desde

a

.

Este artículo discutirá la propiedad del tamaño de una fuente en CSS. También enseñaremos cómo usar explícitamente el Propiedades predefinidas y personalizadas del tamaño de una fuente para elementos de texto. Entonces, comencemos!

Propiedad de tamaño de fuente CSS

En CSS, la propiedad del tamaño de fuente se utiliza para establecer el tamaño de un elemento de texto, y su valor puede ser "Predefinido" o "tamaño personalizado".

En las secciones dadas a continuación, hablaremos brevemente sobre los valores CSS de tamaño de fuente predefinidos y personalizados en la propiedad del tamaño de una fuente.

Propiedad de tamaño de fuente CSS utilizando valores predefinidos

CSS proporciona valores predefinidos para establecer tamaños de fuente de textos. La propiedad del tamaño de fuente CSS se utiliza cuando tenemos la información relacionada con el tamaño físico de la salida. Además, los navegadores no permiten modificar el tamaño del texto debido a las malas razones de accesibilidad.

Consulte la siguiente lista de los valores de propiedad de tamaño de fuente predefinidos de CSS:

• Pisotón xx
• Pisotón
• Pequeño
• Medio
• Grande
• Largo X
• Xx-grande

Ahora, echemos un vistazo a la sintaxis de proporcionar valores predefinidos a la propiedad del tamaño de una fuente:

Sintaxis de proporcionar valores predefinidos a la propiedad del tamaño de una fuente

tamaño de fuente: medio | grande | X-Large | XX-Large | XX-Small | X-Small | Small |;

Aquí, debemos agregar un valor específico para el "tamaño de fuente" propiedad.

Ejemplo: proporcionar valores predefinidos a la propiedad del tamaño de una fuente

En este ejemplo, especificaremos diferentes valores de propiedad de tamaño de fuente predefinidos para elementos de párrafo:

Este es un texto de Large XX.

Este es un texto X-Large.

Este es un texto grande.

Este es texto medio.

Este es un texto pequeño.

Este es el texto X-Small.

Este es un texto XX-Small.

Abra el archivo HTML en un navegador después de agregar el código especificado. Al hacerlo, el texto de los párrafos tendrá el siguiente formato:

En la siguiente sección, demostraremos el uso de "costumbre" Valores de propiedad del tamaño de una fuente.

Propiedad de tamaño de fuente CSS utilizando valores personalizados

Proporcionando el Valores personalizados a la propiedad del tamaño de una fuente, puedes configurar el tamaño de una fuente según los elementos circundantes, y esta propiedad también permite a un usuario cambiar el tamaño de fuente en los navegadores.

En CSS, la propiedad del tamaño de una fuente comprende los siguientes valores personalizados:

• tamaño de fuente con píxeles
• tamaño de fuente con ellos
• tamaño de fuente con valores porcentuales
• Tamaño de fuente receptivo

Propiedad del tamaño de fuente CSS con píxeles

En este método, "Píxeles" se utilizan para establecer el valor de la propiedad del tamaño de la fuente, ofreciendo el control completo del control del tamaño del texto al usuario. Es un valor estático que es totalmente independiente del sistema operativo.

Ejemplo: propiedad del tamaño de fuente CSS con píxeles

Ahora, estableceremos el tamaño de fuente de los elementos del párrafo de acuerdo con diferentes valores de píxeles como "50px", "40px" y "30px":

Asignamos "50px" a este texto.

Asignamos "40px" a este texto.

Asignamos "30px" a este texto.

Producción

Como puede ver en la salida dada, el tamaño de texto de los párrafos se establece de acuerdo con los valores de píxeles especificados.

Propiedad del tamaño de la fuente CSS con EM

El "Em" valores del CSS propiedad del tamaño de una fuente se utilizan para establecer el tamaño del texto de acuerdo con el tamaño de la fuente principal en los navegadores. Muchos desarrolladores prefieren "Em" sobre "Píxeles" porque ofrece un buen nivel de compatibilidad para los navegadores.

Nota: En un navegador, el tamaño de texto predeterminado se establece en 16 píxeles y uno, Lo que significa que 1 em = 16 píxeles.

Eche un vistazo al ejemplo de abajo dado:

Ejemplo: propiedad del tamaño de fuente CSS con EM

En este ejemplo, estableceremos el "Em" valor para los elementos de texto igual que el ejemplo anterior. Para hacerlo, dividiremos el número de píxeles con "dieciséis" y luego especifique el valor resultante como valor de propiedad de tamaño de fuente de los elementos agregados:

Esto se dirige 1

Esto se dirige 2

Este es un párrafo.

La salida dada significa que hemos aplicado con éxito la propiedad del tamaño de una fuente "Em" valores:

Propiedad del tamaño de fuente CSS con valores porcentuales

También podemos establecer el tamaño de fuente con respecto a porcentaje, y en este método, el porcentaje de fuente se puede aumentar de 100%.

Ejemplo: propiedad del tamaño de fuente CSS con valores porcentuales

Ahora, asignaremos diferentes valores porcentuales al "tamaño de fuente" Propiedades de los elementos del párrafo:

Esto tiene un 130% de texto del tamaño de una fuente.

Esto tiene un 120% de texto del tamaño de una fuente.

Esto tiene un 90% de texto del tamaño de una fuente.

Esto tiene un 70% de texto del tamaño de una fuente.

Producción

Propiedad de tamaño de fuente receptiva de CSS

Usando CSS propiedad de tamaño de fuente receptiva, También puede establecer el tamaño del texto de acuerdo con el ancho de la ventana de la ventana de su navegador. Para este propósito, el "VW" Se utiliza el valor unitario, mientras que 1VW = 1% del ancho de la visión.

Nota: Si el usuario no define el tamaño de la fuente del texto, entonces el tamaño predeterminado de un texto es igual a 16 PX o 1EM.

Ejemplo: propiedad del tamaño de fuente receptiva de CSS

Ejemplo de texto receptivo

Cambiar el tamaño de la ventana del navegador para verificar la escalabilidad del texto.

Producción

En el ejemplo anterior, el texto se puede cambiar de tamaño de acuerdo con el navegador, y seguirá el tamaño de la ventana del navegador.

Conclusión

En CSS, la propiedad del tamaño de fuente se utiliza para establecer el tamaño de un elemento de texto, y su valor puede ser "Predefinido" o "personalizado". Múltiples unidades de medición como Píxeles, EM, Vistas, ancho y valores porcentuales se especifican como los valores de la propiedad del tamaño de una fuente. Este artículo sobre la propiedad del tamaño de fuente CSS y demostró el método para usar explícitamente el Propiedad predefinida y personalizada del tamaño de una fuente Valores para elementos de texto.