recherche

Maison  >  Article  >  interface Web  >  Comment faire en sorte que le texte de prise en charge de Chrome soit inférieur à 12 px en HTML ?

Comment faire en sorte que le texte de prise en charge de Chrome soit inférieur à 12 px en HTML ?

韦小宝
韦小宝original
2017-11-29 10:56:141870parcourir

Si le texte sur la

photo du designer est 10px, nous l'implémenterons sur la page Web. Souvent, les concepteurs reviennent vers nous et nous demandent : cette police peut-elle être plus petite ? Ce que j'ai conçu fait 10px ? Pourquoi est-il 12px ? En fait, nous savons tous que la taille de police minimale de Google Chrome est 12px, peu importe que vous la définissiez sur 8px ou 10px, en Seulement 12px sera affiché dans le navigateur, alors comment résoudre ce problème de triche ? Jetons un coup d'œil à la solution !

Notre approche est la suivante :

Pour le noyau Google Chrome, ajoutez le préfixe webkit et utilisez l'attribut transform:scale() Allez sur Zoom !

Démonstration de code : 

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			span{
				font-size: 12px;
				display: inline-block;
				-webkit-transform:scale(0.8);
			}
		</style>
	</head>
	<body>
		<span>测试10px</span>
	</body>
</html>

Ce qui précède explique comment rendre le texte de prise en charge de Chrome inférieur à 12 px en HTML ? Tout le contenu, veuillez vous rendre sur ce siteRechercherpour en savoir plus !

Recommandations associées :

Comment optimiser les pages Web HTML

Comment le style de barre de défilement CSS est-il compatible avec les navigateurs IE8 et Chrome ?

Comment gérer l'affichage incomplet de la dernière ligne de texte en HTML

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!

Déclaration：
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
Article précédent：Solution à l'échec de Jquery à lier l'événement Click aux nœuds nouvellement insérésArticle suivant：Solution à l'échec de Jquery à lier l'événement Click aux nœuds nouvellement insérés

Articles Liés

Voir plus