Subject   : ボックスの配置と位置指定

カテゴリー  : Home page > スタイルシート


 ボックスの配置(position)

「position」プロパティは、ボックスの配置方法を指定します。

説明 メモ
static 通常の位置に表示 デフォルト
relative 相対的な位置指定 通常の位置を基準
absolute 親要素を基準とした絶対的な位置 *
fixed 絶対的な位置に固定 スクロールしても動かない

* 親要素に relative または absolute を指定している場合は、その親要素の位置を基準にします。それ以外の場合は、ページの枠を基準とした位置の指定になります。


 ボックスの表示位置を指定するプロパティ

top、right、bottom、left は、ボックスの表示位置を指定するプロパティです。 この表示位置の指定は、position プロパティで relative、absolute、fixed を指定している場合に有効です。

説明
top 上からの距離を指定します 数値+単位(px、他)か %(割合)
right 右からの距離を指定します 数値+単位(px、他)か %(割合)
left 左からの距離を指定します 数値+単位(px、他)か %(割合)
bottom 下からの距離を指定します 数値+単位(px、他)か %(割合)

 ■ 使用例
< DIV STYLE="position: absolute; top: 100px; left:50px;">


   ⇒ スタイルシートのboxの概念

[メニューへ戻る]  [HOMEへ戻る]  [前のページに戻る]