CSS では、visibility 属性を使用して、親要素を非表示にし、子要素を表示できます。親要素に「visibility:hidden」スタイルを追加し、「visibility:visible」スタイルを追加するだけです。子要素に。
このチュートリアルの動作環境: Windows 7 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。
css で親要素を非表示にして子要素を表示する方法
親要素を非表示にして子要素を表示するのは非常に簡単です。 CSS の要素を使用するには、親要素に Visibility:hidden スタイルを追加して非表示にし、子要素に Visibility:visible スタイルを追加して表示するだけです。
例で見てみましょう 例は次のとおりです:
<!DOCTYPE html> <html> <head> </head> <body> <div style="height:50px;width:300px;border:1px solid black;background-color:yellow;"> <p>1231231231231325654654635165</p> </div> </body> </html>
出力結果:
親要素子に与えた場合 要素にスタイルを追加後:
<!DOCTYPE html>
<html>
<head>
<style>
div{
visibility:hidden;
}
p{
visibility:visible;
}
</style>
</head>
<body>
<div style="height:50px;width:300px;border:1px solid black;background-color:yellow;">
<p>1231231231231325654654635165</p>
</div>
</body>
</html>出力結果:
上記の例は親要素を非表示にした場合です子要素の表示。
(学習ビデオ共有: css ビデオ チュートリアル)
以上がCSSで親要素を非表示にして子要素を表示する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
