レスポンシブの時、画面の小さいスマホと大きいスマホでいちいち細かくフォントサイズを変更するのは面倒。
vw
をつかえば画面幅に対する大きさの値になるので、どのデバイスでも画面の横幅に対しての比率が維持されてとても楽。
※ 横向きの時にvwにすると文字が大きくなりすぎるので、メディアクエリの範囲は599px以下くらいで使うのが個人的にはオススメです。
.elem {
font-size: 3.4vw;
}
個人的には、本文にはいつも3.4 ~ 3.6vw
くらいを指定。
ちなみに、実はこのことは以前にも普通の記事の方にメモしているので、もう少し詳しくという方は是非。
あわせて読みたい


レスポンシブの単位には%よりもvw, vhが便利!フォントサイズの指定にも使える
レスポンシブデザインを取り入れたサイトを制作するとき、widthの幅やpaddingの数値などをpxではなく%で指定することが多いかと思います。 ですが、%指定だとかゆくて届...
コメント