【プログラミング】今日の学び
marginの相殺
垂直方向でmarginが重なると、小さいほうが打ち消される。
displayプロパティ
①block
- <p> <h1> <div> <section>など。
- 下に追加されていく。
- widthやheightを設定できる。
（widthはデフォルトでは親要素の幅いっぱい、heightはコンテンツの高さになる）
②inline
- <img> <span> <a> <input>など文中に配置される要素。
- 左に詰めてならぶ。
- widthやheightが無効になる。
③inline-block
- 左に詰めて並べたいけれどwidthやheightも設定したいとき。
positionプロパティ
①static→通常通りに配置。（初期値）
②relative→top,left,right,bottomなどで指定。staticの位置から指定した分だけ移動する。
③fixed→ウィンドウの左上を起点にして、指定した分だけ移動する。
スクロールしても固定配置される。
④absolute
- 親要素がstatic→ウィンドウの左上を起点に指定した分だけ移動する。 この場合はスクロールした場合は固定されていない。
- 親要素がstatic以外→親要素を基準に配置される。
z-index
要素の重なり順を指定。数値が大きいほど上にくる。
