Css-position

提供:Dev Guides
移動先:案内検索

CSS-位置

説明

_position_プロパティは、要素の配置に使用されます。 top、right、bottom、leftの各プロパティと組み合わせて使用​​して、目的の要素を配置できます。

可能な値

  • static -要素ボックスは、前の要素と前の要素に続いて、通常のドキュメントフローの一部としてレイアウトされます。
  • relative -要素のボックスは通常のフローの一部としてレイアウトされ、ある距離だけオフセットされます。
  • absolute -要素のボックスは、その包含ブロックに関連してレイアウトされ、ドキュメントの通常のフローから完全に削除されます。
  • 修正済み-element.sボックスは絶対位置にあり、position:absoluteで説明されているすべての動作を備えています。 主な違いは、固定位置要素の包含ブロックが常にビューポートであることです。

DOM構文

object.style.position = "static";

に適用されます

すべてのHTML要素。

ここに例があります-

<html>
   <head>
      <style type = "text/css">
         img#lead {position: absolute;}
         div.top {position: fixed; top: 0; height: 10% width: 100%;}
         sup {position: relative; bottom: 0.66em;}
      </style>
   </head>

   <body>
      <img src = "/css/images/bullet.gif">
      <div>finddevguides.com</div>
      <p>This text contains <sup>superscript</sup> text.</p>
   </body>
</html>

それは次の結果を生成します-