Google Chrome の小さなフォント処理ソリューション、つまり 12px_html5 未満のフォントのチュートリアル スキル

Google Chrome は、おそらくユーザー エクスペリエンスのため、12 ピクセル未満の小さなフォントをサポートしていません。
インターネット上には、それが使用できるという記事もいくつかあります:

コードをコピー

コード

-webkit-text-size-adjust:none;

ただし、Chrome 27 以降、この属性のサポートは削除されました。

この問題を解決する他の方法はありますか?

Google Chrome は CSS スケーリングをサポートしているため、これについて大騒ぎすることができます:

コードをコピー

コードは次のとおりです。

-webkit-transform:scale(0.5);

最小サポートは 12px なので、12px に基づいてスケーリングします。
同時に、-webkit-transform-origin-x: 0; を使用して、スケーリング後のマージン左の変位の問題を解決できます。

コードをコピーしますコードは次のとおりです:

.test_tag{
font-size:12px>-webkit-transform-origin- x: 0;
-webkit-transform:scale(0.5833333333333334);


スケール値は次のように計算されます: 7 / 12 = 0.5833333333333334