ホームページ >ウェブフロントエンド >htmlチュートリアル >表示: なしは機能しません_html/css_WEB-ITnose
表示: なしは機能しません_html/css_WEB-ITnose
- WBOYオリジナル
- 2016-06-24 11:15:123754ブラウズ
<html> <head> <meta http-equiv="content-type" content='text/html;charset=utf-8'/> <style> <!--本页的css样式--> .reveal * {display: none;} /*.reveal * {background-color: gray;}*/ .reveal *.handle {display: block;} .reveal *.handle {background-color: gray;} </style> </head> <body> <div class="reveal"> <h1 class="handle">Click Here to Reveal Hidden Text</h1> <p>This paragraph is hidden. It appears when you click on title.</p> </div> </body></html> .reveal * {display: none;} は .handle 要素を除いて非表示にする必要があります。 なぜ display: none が機能しないのでしょうか?
ディスカッションへの返信(解決策)
重複した場合、前のクラスの表示は無効になります。
.reveal * {display: none;} この効果は .reveal *.handle {display: block;} によってオーバーライドされます
まず、このコメントを変更します (つまり CSS)。 / , e8274c01fbee01dfcd280009674a74dd /*このページの css スタイル*/ に変更されました
優先事項、 .reveal *.handle は .reveal * {display: none;} よりも上位です、最も優先度の高いものが有効になります
<--このページの CSS スタイル-->
これは CSS ではありません。構文に注意してください。スタイルは次の行で破棄されます
正しいです。 3階と4階でお答えします、ありがとうございます
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。