top CSS プロパティとは
トピック：参照要素のボックスまたはブラウザウィンドウの上端を基準にして、配置された要素の上端のオフセットを指定する、ことができる
プロパティ top
実例 コード 1
サンプル コードを試すp { position: absolute; top: 150px;}
情報：- 絶対 位置指定要素（
positionが absolute 又はfixedである要素）では、要素のマージン境界の上辺と包含ブロックの上辺の距離を定義する ことができる。 - 相対 位置指定要素（
position がrelativeである要素）では、通常位置からの下方への移動量を定義する ことができる top と bottom の両方が定義されると、要素の位置は 過制約 (over-constrained) の状態になり、top プロパティが優先されます: bottom の計算値には -top がセットされ、指定した値は 無視 される
プロパティ 定義と使用法
| デフォルト値・初期値 : | auto |
|---|
| 適用対象 : | 配置された要素 |
|---|
| 継承 : | 不可 |
|---|
| 相対値の基準 : | 包含ブロックの高さ |
|---|
| メディア : | visual |
|---|
CSS Version | CSS2 ～ |
|---|
| 計算値 : | 長さで指定されると相当する絶対的な長さ、パーセンテージとして指定されると指定値、それ以外では auto |
|---|
| JavaScript 構文 | object.style.top="funWebref" |
|---|
| アニメーションの種類 : | length または percentage, calc(); |
|---|
| 正規順序 : | 形式文法で定義される一意のあいまいでない順序 |
|---|
| CSSの構文 | top: auto | length | initial | inherit; |
|---|
プロパティ値
| 値 | 説明 |
length(長さ) | 長さ値としてオフセットを指定しpx,pt,cm,emなど、負の長さの値が許可されている。 |
percentage(パーセント) | オフセットをパーセンテージで指定する パーセンテージは、要素を含むブロックの高さに対して計算される 負のパーセント値は許可される。 |
auto | ブラウザは上端の位置を計算する これはデフォルト値です。 |
initial | このプロパティをデフォルト値に設定する |
inherit | 親要素からこのプロパティを継承する |
サポートするデスクトップ ブラウザ対応・互換性
| 機能 | Chrome | Firefox | Internet Explorer | Opera | Safari |
|---|
| 基本サポート | サポート◯ | 1.0 (1.7 or earlier) | サポート◯ | サポート◯ | サポート◯ |
|---|
サポートするモバイル ブラウザ対応・互換性
| 機能 | Android | Chrome for Android | Firefox Mobile | IE Mobile | Opera Mobile | Safari Mobile |
|---|
| 基本サポート | 不明 | 不明 | 不明 | 不明 | 不明 | 不明 |
|---|
CSS top | CSS プロパティ 値| 意味 使い方 実例 – WebRef