static | 通常の配置方法 |
relative | 通常の配置方法と同じように配置 左上を基準としてtopプロパティなどとの組み合わせで相対的に配置 |
absolute | 絶対的な位置に配置 親要素がstaticの場合、ブラウザの左上が基準 親要素がstatic以外の場合、親要素の左上が基準 |
fixed | ブラウザの左上を基準に絶対配置 スクロールしても位置が固定される |
sticky | relateiveと同様に通常の配置方法と同じように配置されるが、 スクロールされる親要素に対しては絶対配置・固定される スクロールに追尾していく広告などによく使われます |
top :「位置」 | 基準位置上部からの位置 |
bottom :「位置」 | 基準位置下部からの位置 |
left :「位置」 | 基準位置左からの位置 |
right :「位置」 | 基準位置右からの位置 |
auto(初期値) | 自動指定 |
任意の数値+単位 | 基準位置からの距離で指定 |
%値 | 親要素に対する割合 |
/*↓div要素のボックスの配置方法を指定*/
div {position:「配置方法」; }
/*↓div要素のボックスの配置方法を指定して位置を指定の例*/
div {position:「配置方法」;
top:「位置」;
left:「位置」;
}