ホームページ > 記事 > ウェブフロントエンド > Chrome が HTML で 12 ピクセルより小さいテキストをサポートするようにするにはどうすればよいですか?

Chrome が HTML で 12 ピクセルより小さいテキストをサポートするようにするにはどうすればよいですか?

韦小宝オリジナル: 2017-11-29 10:56:141855ブラウズ

デザイナー写真のテキストが10pxの場合、Webページに実装します。デザイナーが私たちに戻ってきて、「このフォントをもっと小さくできないか?」と尋ねることがよくあります。私がデザインしたのは10px?なぜ 12px なのでしょうか? 実際、Google Chrome の最小フォントサイズは 8px または 10px に設定しても、ブラウザには 12px しか表示されないことは誰もが知っています。では、この不正行為の問題を解決するにはどうすればよいでしょうか?解決策を見てみましょう！

私たちのアプローチは次のとおりです: Google Chrome カーネルの場合、Webkit プレフィックスを追加し、transform:scale()
属性
を使用してスケーリングします。

コードデモ:

<!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>

上記は、Chrome サポートテキストを HTML で 12px より小さくする方法です。すべてのコンテンツについては、このサイトにアクセスしてください検索!

Chrome が HTML で 12 ピクセルより小さいテキストをサポートするようにするにはどうすればよいですか?

関連記事