css - CSS 表示規則

Question

これをGoogleで検索しようとしましたが、役に立ちませんでした。

CSS のレンダリングと可視性のルールを説明する優れたリソースを教えてもらえますか? または、非常に簡単な場合は、誰かここに書き留めてもらえますか?

例を挙げると、互いに含まれていない 2 つの大きDIV_LARGE1なDIV_LARGE2div と小さな div があるとしDIV_SMALLます。DIV_SMALLが 内に定義されている場合、 のDIV_LARGE1内側にある部分は見えますDIV_LARGE1が、 と共有されている領域は のDIV_LARGE2下に隠れますDIV_LARGE2。ページがレンダリングされた後 (クリックで)をDIV_SMALL(設定して)表示しているので、HTML コードの 後に​​来ることは重要ではありません。display:inlineDIV_LARGE2DIV_LARGE1

何が優先されますか？私の小さな div には がposition:relativeあり、他の両方の div ( DIV_LARGE*)position:absoluteには があるため、div が内部で定義されていない場合は、相対配置よりも絶対配置が優先されると推測できます。しかし、これは正しいですか？正確なルールは何ですか？

Answer 1

Phelios は正しいです。あなたが直面している問題は z-index プロパティに関連しています。これについて詳しく説明している SmashingMag の素晴らしい記事は次のとおりです。

tl;dr の場合、配置された要素は html コードに配置された順序でスタックされるため、最初の大きな div 内の div_small は、デフォルトで常に 2 番目の大きな div の「下」にスタックされます。css で小さい div の z-index プロパティを設定することで、これを修正できます。