ブートストラップ応答テキストサイズ

Question

私はブートストラップを使用してレスポンシブレイアウトを作成しようとしていて、現在font-sizeでタイトルのいくつかを定義しています。

しかし、レイアウトが縮小されると、これは大きすぎます。どうやってテキストのサイズを小さくすることができますか？

Answer 1

最も簡単な方法は、次元を％またはemで使用することです。基本フォントサイズを変更するだけで、すべてが変更されます。

少ない

@media (max-width: @screen-xs) {
    body{font-size: 10px;}
}

@media (max-width: @screen-sm) {
    body{font-size: 14px;}
}


h5{
    font-size: 1.4em;
}       

https://stackoverflow.com/a/21981859/406659 ですべての方法を見てください。

あなたはビューポートユニット（vh、vw ...）を使うことができますが、それらは Android <4.4 で動作しません

Answer 2

さて、私の解決策は一種のハックですが、それはうまくいき私はそれを使っています。

1vw = 1% of viewport width

1vh = 1% of viewport height

1vmin = 1vw or 1vh, whichever is smaller

1vmax = 1vw or 1vh, whichever is larger

h1 {
  font-size: 5.9vw;
}
h2 {
  font-size: 3.0vh;
}
p {
  font-size: 2vmin;
}