位置の 4 つの属性値:
1.相対的
2.絶対
3.固定
4.静的
これら 4 つの属性については以下で説明します。
<div id=parent> <div id=sub1>サブ1</div> <div id=sub2>サブ2</div></div>1.相対的
相対属性は比較的単純です。どのオブジェクトからオフセットされているかを把握する必要があります。答えはその場所にあります。上記のコードでは、sub1 と sub2 が兄弟関係にあります。たとえば、sub1 の相対属性を設定する場合は、次の CSS コードを設定します。
#sub1{ 位置: 相対; 上: 5 ピクセル; }相対属性が設定されていない場合、sub1 の位置は通常の文書の流れに従って特定の位置にあるはずであることがわかります。ただし、sub1 の位置を相対に設定すると、上、右、下、左の値に応じて想定される位置にオフセットされます。相対の意味もこれに反映されます。
このために必要なのは、相対値を設定しない場合は sub1 がどこにあるかを覚えておき、設定した後にはそこからオフセットすることだけです。
次に問題となるのは、sub2 の位置はどこにあるのかということです。答えは、sub1 がposition 属性を追加するため、以前の位置と現在の位置は変わりません。
このときsub2の位置も相対にするとどうなるでしょうか？この時点では、sub1 と同じままで、元の位置に従ってオフセットされます。
相対オフセットはオブジェクトのマージンの左上側に基づいていることに注意してください。
2.絶対この特性は常に誤解を招きます。位置属性が絶対に設定されている場合、常にブラウザウィンドウに従って配置されると言われていますが、これは実際には間違っています。実はこれが固定資産の特徴なのです。
sub1の位置を絶対位置にした場合、オフセットする対象は誰になりますか？ここには 2 つの状況があります。
(1) sub1 の親オブジェクト (親オブジェクトである場合は曾祖父) の親も位置属性を設定し、位置の属性値が絶対または相対である場合、つまりデフォルト値ではない場合、その後、sub1 が続きます。 この親は位置決めに使用されます。
オブジェクトは決定されましたが、注意が必要な詳細がいくつかあることに注意してください。つまり、オブジェクトを配置するには親のどの位置点を使用する必要があるかということです。親がマージン、ボーダー、パディングなどの属性を設定している場合、この位置決めポイントはパディングを無視し、パディングの先頭から (つまり、パディングの左上隅からのみ開始して) 配置されます。つまり、パディングを無視しますが、もちろんマージンとボーダーは無視しません。
次の質問は、sub2 の場所はどこですか?位置が絶対に設定されている場合、sub1 は親に属していないかのように通常のドキュメント フローからオーバーフローしてしまうため、DreamWeaver ではレイヤーと呼ばれていますが、実際には同じ意味です。この時点で、sub2 は sub1 の位置を取得し、そのドキュメント フローは sub1 に基づくのではなく、親から直接開始されます。
(2) sub1 に位置属性を持つ親オブジェクトがない場合は、body を配置オブジェクトとして使用し、ブラウザ ウィンドウに従って配置されます。
3.固定固定は特別な絶対値です。つまり、固定は常に本体を位置決めオブジェクトとして使用し、スクロール バーがドラッグされてもその位置は変更されません。 「background-attachment:fixed」に似ています
もちろんDreamweaverではサポートされていないようです
4.静的通常、position 属性が設定されていない場合は、通常のドキュメント フローに従って配置されます。
要約する上記は編集者によって紹介された HTML での位置の使用法です。ご質問があれば、メッセージを残してください。編集者がすぐに返信します。また、VeVb武道サイトを応援してくださった皆様、誠にありがとうございました！