ホームページ >ウェブフロントエンド >CSSチュートリアル >「position:Absolute」を使用する場合の「top」、「left」、「bottom」、および「right」のデフォルト値は何ですか?

「position:Absolute」を使用する場合の「top」、「left」、「bottom」、および「right」のデフォルト値は何ですか?

Linda Hamilton
Linda Hamiltonオリジナル
2024-11-07 03:16:03172ブラウズ

What are the Default Values for `top`, `left`, `bottom`, and `right` when Using `position: absolute`?

位置: 絶対値のデフォルト値

値を指定せずに CSS プロパティの位置: 絶対値を使用する場合は、デフォルト値を理解することが重要です上、左、下、右のプロパティの値。一般的な考えに反して、これらの値はデフォルトでは 0 に設定されません。

代わりに、これらすべてのプロパティのデフォルト値は「auto」です。これは、要素がまったく配置されていないかのように、レイアウト内の通常の位置に残ることを意味します。これは「静的位置」と呼ばれます。

すべてのオフセット値が「auto」に設定された要素の動作は、CSS 仕様で定義されています。水平位置の場合、制約は次のとおりです。

'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block

「left」、「width」、「right」の 3 つすべてが「auto」の場合、要素の幅は「shrink-to-」に設定されます。

同様に、垂直位置の制約は次のとおりです:

'top' + 'margin-top' + 'border-top-width' + 'padding-top' + 'height' + 'padding-bottom' + 'border-bottom-width' + 'margin-bottom' + 'bottom' = height of containing block

「top」の 3 つすべてが一致する場合、'height'、および 'bottom' は「自動」で、要素の上部の値は静的位置に設定され、その高さはコンテンツに基づいて決定されます。

以上が「position:Absolute」を使用する場合の「top」、「left」、「bottom」、および「right」のデフォルト値は何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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