位置属性問題_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 12:13:18880ブラウズ

        <div class="right">        	<div class="shadow"></div>      	</div>


.right{	width:30%;	float:right;	position:relative;	}.shadow{	width: 100px;	height: 100px;	background-color: rgb(237, 237, 237);	position: absolute;	left: 0px;	top: 2px;	}


重要なのは、right の位置属性が相対である場合に、右側の位置属性がデフォルトで静的である場合に、影がページの左上隅に移動するのはなぜでしょうか。


ディスカッションへの返信 (解決策)

絶対配置された要素の位置は、最も近い配置された祖先要素を基準とします。要素に配置された祖先要素がない場合、その位置は元の包含ブロックを基準とします。それは身体です)。

絶対配置された要素の位置は、最も近い配置された祖先要素を基準とします。要素に配置された祖先要素がない場合、その位置は元の包含ブロック (つまり、本体) を基準とします。

それは、static は配置されず、relative が配置されるという意味ですか?

?
.right
float:right;
あなたがこれを書きました

絶対配置された要素の位置は、配置された祖先要素が存在しない場合、その位置は最初の要素を基準とします。含まれるブロック (つまり、本体)。
++++

static は位置のデフォルト値であり、位置決めされません。

BODY の位置を基準とした絶対的な相対位置
その他、親コンテナの位置を基準とした相対位置。

relative は、通常の位置を基準にして相対的に配置された要素を生成します。このとき、影は右より左に 0 ピクセル、上に 2 ピクセルオフセットされます。
静的なデフォルト値。位置決めを行わない場合、要素は通常のフローで表示されます (上、下、左、右、または z-index 宣言は無視されます)。

この状況は、HTML が w3c 標準に従っていないことが原因である可能性が高いです

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。