Helpers
Core - Helpersは次の内容で構成されています。
- Extends
- Functions
- Mixins
- Keyframe Animations
サイジングに関する注意
デフォルトでは、MVCSS では全ての要素(
font-size
、margin
、padding
)のサイズをremsで指定します。単純に
$base-fontSize
で目標のピクセル値を除算するrem()
関数を通してremsの値を得ることができます。次に例を示します。
h4
font-size: rem(20px)
注意:remsが正しい選択であるかどうかを判断するために、サイトのブラウザのサポートを確認してくだし。remについて現在のブラウザのサポートを見てみましょう。
あなたがemsを使用したい場合は、同じように利用できるem()
関数があります:
h4
font-size: em(20px)
しかし、emsでは、仮にデフォルトの
$base-fontSize
からコンテキストを変更した場合、2番目の引数として新しいコンテキストを渡す必要があります:
h4
font-size: em(20px)
padding-bottom: em(10px, 20px)
調整をより簡単にするために、サイズ指定のためのローカル変数$context
を作成します。
h4
$context: 20px
font-size: em($context)
padding-bottom: em(10px, $context)