HTMLの基礎

HTMLには、ブロック要素とインライン要素がある。
ブロック要素の中にインライン要素を書くことはできるけど、その逆はできない

ブロック要素同士を連続で書くと縦に並ぶことになります。 一方、インライン要素のタグを連続で書くと横に並びます。

属性について

id属性：様々なHTMLタグで使われる。要素に好きな「固有名」を付ける
class属性：様々なHTMLタグで使われる。要素に好きな「分類名」を付ける
src属性：imgタグ（画像を表示するタグ）で使われる。画像ファイルの置き場所を示す
href属性：aタグ（ハイパーリンク）で使われる。リンク先を示す

要素について

コンテンツエリア…内容が表示される部分
padding…要素の中に割り当てられている余白
border…要素の境界
margin…隣接する要素との余白

box-sizing

border-boxは指定したwidth,heightはborder,padding,コンテンツエリアの合計になる。

line-height

高さというよりは、行間を開けるイメージ

vertical-align

text-alignが水平方向で、vertical-alignは垂直方向

letter-spacing

文字の間隔の調整

float

floatを使うと横並びにできる、clear:bothとすればfloatをクリアできる。

flex

flexはfloatより自由に要素の位置を指定できる。
まず、要素の親にdisplay:flexと指定。