L'expérience utilisateur passe en premier, la taille de la police abandonne px et choisit l'échange em_Experience

À l'ère d'Internet d'aujourd'hui qui prône la conception de la convivialité et la conception de l'expérience utilisateur, CSS doit également y participer. La plupart des gens définissent toujours la taille globale de la police en premier lors de l'écriture du code CSS. Dans les cas chinois, elle est généralement de 12 pixels. Cependant, en fait, le paramètre « Afficher la taille du texte » dans le menu supérieur d'IE n'a aucun effet. Il s’agit sans aucun doute d’une très mauvaise expérience utilisateur pour les téléspectateurs qui estiment que la taille de la police est trop petite. En fait, tout cela peut être évité, c'est-à-dire utiliser les unités em comme unités d'affichage des polices.

La hauteur de police par défaut du navigateur est de 16px, donc le navigateur non ajusté affiche 1em=16px. S'il est converti, cela signifie 1px=0,0625em, c'est-à-dire 12px=0,75em, 10px=0,625em. Grâce à 1px=0,0625em, vous pouvez convertir px en em lors de l'écriture de CSS. Mais il existe un moyen plus pratique, continuez à lire !

Cette méthode nécessite l'utilisation de l'unité % (une seule fois). En fait, % et em peuvent être compris simplement car le premier n'a que deux zéros de plus que le second. Afin de simplifier la conversion de font-size, vous pouvez déclarer font-size=62.5% globalement dans le corps en CSS. L'algorithme % est ici le même que em, 100%=16px, 1px=6.25%, 10px=62.5. %, Autrement dit, la taille de police par défaut est définie sur 10 px. De nombreux débutants peuvent définir 0,625em ici ou définir directement 12px. Assurez-vous de définir font-size=62,5% ! Puisque em a la particularité d'hériter de la taille de police de l'élément de fond perdu parent, qui est 1em=10px, donc 12px=1.2em. La conversion entre px et em peut s'obtenir via 10, ce qui est très pratique !

De plus, une chose doit être notée. Il se peut que lorsque IE traite les caractères chinois, la précision des valeurs à virgule flottante soit limitée à 62,5% des polices 12px sous le corps sont un peu plus grandes que. ceux directement définis pour autant que le Juste change de 62,5% à 63%. Grâce aux ajustements ci-dessus du code CSS, vous constaterez que votre site Web se rapproche de la conception de l'expérience utilisateur. Ceci est très important à l'ère d'Internet d'aujourd'hui qui prône la conception de la convivialité et la conception de l'expérience utilisateur.

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Accueil des scripts <a href="</title">www.jb51.net</a> </title>> <style type="text/css"> body{ font-size:63%; } </style> <p style="font-size:1.2em;">taille de police : 1,2em Alimanman (peut être ajusté)</p> <p style="font-size:12px;">font-size:12px Alimanman (ne peut pas être ajusté)</p> <p style="font-size:1.2em; color:#F90;">Vous pouvez ajuster la taille d'affichage de la police via "Affichage - Taille du texte" dans le menu supérieur d'IE </p>
[Ctrl+A pour tout sélectionner Remarque : Si vous devez introduire des J externes, vous devez l'actualiser pour l'exécuter ]