HTMLとCSSメモ 1

リセットCSSで、初期化

インライン要素で謎の隙間消し
→親要素にfont-size:0;

img要素の隙間消し
→img{
vertical-align:bottom;
}

レスポンシブ対応
→フォントサイズを62.5%にし、基準として、remでフォントサイズを指定する
→デフォルト16pxなので62.5％＝10pxを1remにする（625％=100pxもあり）

@media screen and(min-width:**px)などで、幅によってCSS指定を使い分けれる

ブロック要素は改行あり、インライン要素は改行なし
→インライン要素の中にブロック要素は配置できない
→HTML5ではさらに細かい分類

パディング、ボーダーは幅を指定してもサイズを増やしてしまう
→box-sizing:border-box;
　で解決（初期値はcontent-box)

floatとinline-block
→floatは上に詰められる（基本的に）
　inline-blockは行が揃う