新しく立ち上げたサイト のフォントサイズを調整しようとしたんですが、スタイルシートに見慣れない単位「vw」がありました。
px、%、rem、em と、ただでさえ多いサイズ指定の単位。
そこへ新たに加わった vw が私を悩ませます。
しかも、calc 付きです。(計算式)
調べてみたら、vw に関連して vh、vmin、vmax までありました(笑)
昔は px だけの幸せな世界だったのに・・・。
vw 系列は、最近出てきたわけではなくて、私が知らなかっただけ。
レスポンシブデザインに対応させるのに便利で、vw だと Viewport の横幅に対応しており、100vw が 横幅100%となります。
なので、横幅 600px の画面に対して、50vw と指定してあげれば 300px に。
横幅 1000px の画面に対しては 500px になり、画面の幅に合わせて自動的に調整をしてくれます。
一応、理屈は分かったので、これから調整をがんばります。
フォントサイズで書きましたけど、それ以外のサイズ指定にも使えますよ。