画面サイズに合わせてフォントサイズが変わるようにする
画面サイズに合わせてフォントサイズが変わるようにする設定のメモ。
Bootstrapの切り替えポイントに合わせて、
viewport:576pxでFont-size:14pxに、
viewport:992pxでFont-size:16pxに。
を基準にしてフォントサイズを可変に。
html {
font-size: calc(87.5% + 2 * (100vw - 576px) / 416);@important!
}
この設定だと、
viewport: 360pxだとフォントサイズはおよそ13pxで、
viewport:1366pxだとフォントサイズはおよそ18pxくらいに。
コメントを残す