CSSで親Divを隠しながら子Divを表示するにはどうすればよいですか?

親 Div を非表示にして子 Div を表示する方法

子要素の可視性を維持しながら親 Div を非表示にすることは、CSS 操作によって実現できます。方法は次のとおりです。

ステップ 1: 親 Div を非表示にする

.Main-Div {
  display: none;
}

この CSS ルールは、クラス「Main-Div」を持つ親 Div を非表示にします。

ステップ 2:子 Div を可視にする

.Main-Div > .Inner-Div {
  visibility: visible;
}

このルールは子 Div を対象としています

完全な例

これらのルールを組み合わせると、結果の CSS および HTML コードは次のようになります:

.Main-Div {
  display: none;
}

.Main-Div > .Inner-Div {
  visibility: visible;
}

<div class="Main-Div">
  This is some Text..
  This is some Text..
  <div class="Inner-Div">
    <a href="#">
      <img src="/image/pic.jpg" />
    </a>
  </div>
  This is some Text..
  This is some Text..
</div>

この手法を適用すると、親 div が非表示の場合でも子要素を選択的に表示できます。

以上がCSSで親Divを隠しながら子Divを表示するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。