Maison > interface Web > tutoriel CSS > Comment puis-je récupérer et ajuster avec précision la taille de la police en HTML ?

Comment puis-je récupérer et ajuster avec précision la taille de la police en HTML ?

Mary-Kate Olsen
Libérer: 2024-12-15 10:14:13
original
382 Les gens l'ont consulté

How Can I Accurately Retrieve and Adjust Font Size in HTML?

Récupération de la taille de la police en HTML

Obtenir la taille de la police d'un élément HTML peut sembler une tâche simple. Cependant, le simple accès à la propriété style.fontSize peut ne pas toujours donner le résultat souhaité, surtout si la taille de la police est définie dans une feuille de style externe.

Pour obtenir une valeur de taille de police précise, utilisez window.getComputedStyle() méthode. Cette fonction calcule le style effectif d'un élément, y compris tous les styles hérités de ses ancêtres. Voici un exemple :

var el = document.getElementById('foo');
var style = window.getComputedStyle(el, null).getPropertyValue('font-size');
var fontSize = parseFloat(style);
Copier après la connexion

Ce code récupère la taille de police calculée de l'élément avec l'ID "foo" et la stocke dans la variable fontSize. Vous avez maintenant accès à la valeur réelle de la taille de police.

En utilisant cette approche, vous pouvez mettre en œuvre des ajustements dynamiques de la taille de la police. Par exemple :

el.style.fontSize = (fontSize + 1) + 'px';
Copier après la connexion

Cette ligne de code incrémente la taille de la police de l'élément "foo" d'un pas. Vous pouvez remplacer "1" par n'importe quelle valeur souhaitée pour modifier la taille de la police selon vos besoins.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal