■position

・要素の配置を指定するプロパティで、初期値はstatic
・自由に配置できるが多用しすぎると、レスポンシブの際にスタイルの調整が難しくなる場合あり。positionプロパティを使わないとレイアウトを再現できない場合にのみ使うのがよい。

・positionプロパティは「top」「right」「bottom」「left」の4つのプロパティと合わせて要素の配置を指定。要素の位置を確定させるため、最低2つは適用させる。
 

■種類-----------------------------------
【1】static(初期値)…positionプロパティを解除するのに利用

   位置指定不可・重なり順指定不可・要素の高さ保持 

【2】absolute

   親要素を基準に、絶対配置を指定
【3】relative

   現在位置を基準に、相対位置を指定
   単体で使用せず、position: absolute; とセットで使うことが多い
【4】fixed

   要素は浮いたような状態になり画面を基準に要素位置を固定
【5】sticky

   親要素を用意して、追従する範囲を指定

   (スクロールした際に要素を粘着させ、固定表示)

-----------------------------------

■z-indexプロパティ

 数字が大きいほど前、小さいほど後ろに配置

 ただし、positionプロパティ(relative, absolute, fixed, sticky)の適用が必要

 staticはz-indexは反映されない