もっと"Try it Yourself"以下の例。
定義と使用法
positionプロパティは、要素のために使用される測位方法のタイプを指定する(static, relative, absolute or fixed) 。
| デフォルト値： | static |
|---|---|
| 継承されました： | no |
| アニメーション： | no. Read about animatable |
| バージョン： | CSS2 |
| JavaScriptシンタックス： | object .style.position="absolute" Try it |
ブラウザのサポート
表中の数字は完全にプロパティをサポートする最初のブラウザのバージョンを指定します。
| プロパティ | |||||
|---|---|---|---|---|---|
| position | 1.0 | 7.0 | 1.0 | 1.0 | 4.0 |
CSSの構文
position: static|absolute|fixed|relative|initial|inherit;プロパティ値
| 値 | 説明 | それを再生します |
|---|---|---|
| static | デフォルト値。 彼らは、ドキュメントフローに表示される要素は、順番にレンダリング | それを再生します» |
| absolute | 要素は、その最初の位置付けを基準に配置されている(not static)祖先要素 | それを再生します» |
| fixed | 要素は、ブラウザのウィンドウに対して相対的に配置されています | それを再生します» |
| relative | 要素は、その通常の位置に対して配置されますので、 "left:20px"要素の左の位置に20ピクセルを追加します | それを再生します» |
| initial | このプロパティがデフォルト値に設定します。 初期についての記事を読みます | それを再生します» |
| inherit | その親要素からこのプロパティを継承します。 継承についての記事を読みます |
その他の例
例
どのように通常の位置に要素を位置決めする方法：
h2.pos_left {
position: relative;
left: -20px;
}
h2.pos_right {
position:
relative;
left: 20px;
} »それを自分で試してみてください 関連ページ
CSSチュートリアル： CSSのポジショニング
HTML DOMリファレンス： position property