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

非表示の親 DIV 内に非表示の子 DIV を表示する

この記事では、親 DIV を保持したまま子 DIV を表示するという課題に取り組みます。隠れた。この機能は、コンテンツの特定の部分を条件付きで表示または非表示にしたいシナリオで必要になる場合があります。

質問:

非表示中に子 DIV を表示するにはどうすればよいですか?その親DIV?

答え:

これを実現するには、CSS を使用して親と子の両方の DIV の表示設定を変更します。

親 DIV の場合:

• 可視性プロパティを非表示に設定するか、
• オプションで、幅、高さ、マージン、およびパディングのプロパティを 0 に設定して、レイアウトへの影響を最小限に抑えることもできます。

子 DIV の場合:

• 可視性プロパティをvisibleに設定します。

これを行うと、子DIVは親 DIV は非表示のまま表示されます。

実装:

提案された解決策を組み込んだコードの改訂版は次のとおりです:

.Main-Div {
  visibility: hidden;
}

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

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

例:

の場合ライブデモについては、元の回答で提供されている JSFiddle リンクを参照してください: http://jsfiddle.net/pread13/h955D/153/

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