<!DOCTYPE HTML>
<html lang="ja">
<head>
<link rel="stylesheet" text="text/css" href="position.css">
<title></title>
</head>
<body>
<h1>position</h1>
<p>positionはCSSのプロパティで、文書内で要素がどのように配置されるかを設定する。</p>
<h3>値の種類</h3>
<table border=1>
<tr><th bgcolor='#a9a9a9'>positionの値</th><th bgcolor='#a9a9a9'>概要</th></tr>
<tr><td>static</td><td>初期値</td></tr>
<tr><td>relative</td><td>現在の一を基準に<b>相対的</b>な位置を決める</td></tr>
<tr><td>absolute</td><td>親要素を基準に<b>絶対的</b>な位置を決める</td></tr>
<tr><td>fixed</td><td>画面の決まった位置に<b>固定</b>する</td></tr>
<tr><td>sticky</td><td>要素がスクロールに応じて動き、指定された範囲内で固定する<br>
(あまり使わないかも)</td></tr>
</table>
<h2>position: static</h2>
何も指定していない状態と同じ(初期値)。そのため軽く説明する。
<ul>
<li>要素を上下左右に動かすことはできない。</li>
<li>topやleftなどの指定をしても要素の位置を調整することはできない。</li>
<li>z-indexを指定できない。</li>
</ul>
などの特徴がある。
<h4>z-indexとは</h4>
<p>要素の重なり順を決めるプロパティのこと。staticではz-index:0の状態になっている。</p>
</html>
