[100連続学習]TILday 7


いつ使いますか。


注:ブログhttp://triki.net/prgm/3250
今日は既存のプロジェクトをやらずに、新しいサイト(1ページ)を担当することにしました!
特別な機能もないので最初から.
基本設定+反応型publishing
私はpublishingをする時に大きさの単位をpxに変えることに慣れたので、今回変えたいのは基本的に可変単位rem,emです.
でも家に帰ってみる!かばう
%*またはv*を使用して、箱のサイズを調整できます.
フォントサイズの場合、rem emの2つで使用することを考慮します.
呜呜...
今日は家に帰ってお会いできてよかったです.
全部できていて、確認したら怖いです.

rem


remの概念は,標準値を指定倍数表現の大きさに変換することである.ここで、データム値は、トップレベル要素(通常htmlタグ)で指定されたfont-size値です.
例えば、htmlタグのfont-size値が16 pxの場合、2 remは32 pxを表す.
html { font-size: 16px; }
div { 
	font-size: 1.5rem; /* 24px */
	margin: 2rem /* 32px */
	padding: 1.25rem /* 20px */
} 

em


Emの概念は,標準値を指定倍数表現の大きさに変換することである.ここで、条件値は、現在のスタイル設定要素のfont-size値です.
たとえば、現在の要素のfont-size値が16 pxの場合、2 emは32 pxを表します.
div { font-size: 16px; }
div { 
	font-size: 1.5em; /* 24px */
	margin: 2em /* 32px */
	padding: 1.25em /* 20px */
} 

差異


簡単に言えばremとemの標準値は違います.remはトップタグのfont-size値に基づいており、emは現在の要素のfont-size値に基づいている.emでスタイルを指定した要素に個別のfont-size値を指定しない場合、その要素は親要素からfont-size値を継承し、emはその継承値に基づいています.