4

レスポンシブ タイポグラフィに関するさまざまな記事を読んだことがありますが、採用すべき適切な方法が見つかりませんでした。グラフィックソースのすべての人のフォントサイズでこれらの解像度に合わせて webapp を最適化する必要がある場合:

320x480 -> 12px

480x800 -> 20px

540x960 -> 26px

720x1280 -> 26px

私の読書の後、私はcssファイルにこれを入れました：

html { font-size: 100%; -webkit-text-size-adjust: 100%; 
                          -ms-text-size-adjust: 100%; }

次に、イーサン・マルコットの式を使用して、最初のフォントサイズを計算しました。

body{font-size: 0.75em;/*12px/16px */}

次に、メディアクエリを使用して、html 属性のフォントサイズを拡大しました。

/* ===== == = === 30em (480px) === = == ===== */
@media only screen and (min-width : 30em) {
   body{font-size: 125%;}/*20px*/
}
/* ===== == = === 37.5em (600px) === = == ===== */
@media only screen and (min-width: 37.5em) {
    body{font-size: 163%;}/*26px*/
}

これは、フォントをさまざまな解像度に適応させる良い方法ですか? この情報をどこで見つけることができる良い実用的な例がありますか?

前もって感謝します！！！

4

1 に答える 1

1

構造的に、それは私がそれを行う方法です。あなたのmqでパーセンテージを使用するかどうかはわかりませんが、おそらくemで続行します. px から em への優れた計算機は次のとおりです: http://pxtoem.com/

于 2012-08-02T17:41:59.897 に答える