Maison > interface Web > tutoriel CSS > Pourquoi mon texte s'affiche-t-il plus grand que prévu dans Safari sur iPhone ?

Pourquoi mon texte s'affiche-t-il plus grand que prévu dans Safari sur iPhone ?

Linda Hamilton
Libérer: 2024-11-01 16:54:02
original
971 Les gens l'ont consulté

Why is My Text Displaying Larger Than Expected in Safari on iPhone?

Incohérences de taille de police dans Safari sur iPhone

Malgré la définition de tailles de police explicites, vous pouvez rencontrer des cas où Safari sur iOS affiche certains textes plus grands que prévu, même lorsque la valeur de taille de police est plus petite. Cette anomalie peut être attribuée au comportement par défaut de Safari consistant à redimensionner automatiquement le texte jugé trop petit pour être lisible sur les appareils mobiles.

Résoudre le problème avec -webkit-text-size-adjust

Pour contourner ce problème, vous pouvez utiliser la propriété CSS -webkit-text-size-adjust. En définissant -webkit-text-size-adjust: 100%; sur votre élément body, vous demandez à Safari sur iPhone de respecter les tailles de police spécifiées, annulant sa mise à l'échelle automatique. Voici un exemple d'implémentation :

@media screen and (max-device-width: 480px) {
  body {
    -webkit-text-size-adjust: 100%;
  }
}
Copier après la connexion

Cette requête multimédia cible les appareils d'une largeur maximale de 480 pixels, garantissant que la propriété -webkit-text-size-adjust s'applique uniquement aux écrans d'iPhone. En désactivant la mise à l'échelle automatique de Safari dans cette requête multimédia, vous pouvez vous assurer que tout le texte, quelle que soit sa taille de police, sera rendu comme spécifié dans votre feuille de style.

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