webかたつむり ウェブデザインを勉強中 ウェブ初心者のおぼえがき

webかたつむり

ウェブデザインを勉強中

display: inline-block 下書き

  •  html5におけるdisplayの考え方をまとめる。
  • display: block☞要素は改行して縦に積み上がる。幅は指定しなければ親要素の幅いっぱいになる、marginとpaddingは上下左右に使える。親要素に対する上下の位置はmargin,paddingを使って指定する。
  • display: inine☞要素は改行しないで横に並ぶ、幅は要素(の中身そのもの)の幅だけ、marginとpaddingは左右だけ。親要素に対する上下の位置はvertical-alignを使う。
  • display: inine-block☞注意しなくてはいけないことは、改行はしないけれども、前後にマージンが自動的についてしまうこと。floatのように計算してもうまくいかないのはこのため。