なぜBoostraprem
とem
の代わりにpx
を選択して、新しいバージョンのBoostrap 4。
いくつかの変数の例:
$font-size-h1: 2.5rem !default;
$font-size-h2: 2rem !default;
$font-size-h3: 1.75rem !default;
$mark-padding: .2em !default;
emおよびremを使用することをお勧めします:
margin: 0;
padding: 0;
bottom: 0px;
width: 100%;
私はこれについてウェブ上で見つけることができなかったので、私が尋ねている理由に興味があります。
REMは、サイズが明示的に設定されるほとんどすべての場所で役立ちます。
Remを使用すると、すべてのフォントサイズはルート要素(htmlタグ)に関連します。これは、デバイスのスケールアップまたはスケールダウンを簡単にするためです。技術的にhtmlタグを小さいサイズまたは大きいサイズに変更して、すべてのフォントサイズを均等に拡大縮小できます。これはすてきな機能です。
...テイクアウェイの主なものは、すべてが動的であり、ルートHTMLタグに対して相対的であるということです。
たとえば、html cssのfont-sizeを別の数値に変更し、グリッド全体がどのように調整およびスケーリングされるかを確認します。
ソース: Scotch.io
Bootstrap 4はpx
ではなくem
にブレークポイントを保持したことに注意してください。 docs から:
Bootstrap=はほとんどのサイズを定義するためにemsまたはremsを使用しますが、pxはグリッドブレークポイントとコンテナ幅に使用されます。