javascript - jsで解像度に応じてフォントサイズを計算する

Question

すべての画面解像度に合わせてサイトのフォント サイズを変更する方法。これを検索しましたが、まだ目的の結果を得ることができません。そこで、Javaスクリプトを使用して解像度に応じてフォントサイズを計算できる正確な式を教えてください. 前もって感謝します

Answer 1

フォントを em またはパーセンテージで配置してみてください。ブラウザのデフォルトのフォントサイズは 16px です。本文のフォント サイズを変更することで、ドキュメントの本文のフォント サイズ 10px をベース フォントとして変更できます。62.5% = (10/16)*(100)

今、

1em = 10px
100% = 10px

Answer 2

このコンセプトについて話しているのですか？

もしそうなら、これはcssのみの概念証明です:

html { font-size: 62.5%; }
body { font-size: 1em;}

@media (max-width: 300px) {
    html { font-size: 70%; }
}

@media (min-width: 500px) {
    html { font-size: 80%; }
}

@media (min-width: 700px) {
    html { font-size: 120%; }
}

@media (min-width: 1200px) {
    html { font-size: 200%; }
}

Answer 3

お探しのサイズはわかりませんが、これでボールパークに入ることができます。このようなものをお探しですか？

var fontSize = Math.round((12/window.innerWidth)*1200);
document.body.style.fontSize = fontSize+'px';

これらのウィンドウ幅の場合、次のように表示されます...

480 = 30
768 = 19
1024 = 14
1200 = 12

大画面でフォントが小さくならないように最小値を設定することをお勧めします。