首頁 > web前端 > html教學 > display: none 不起作用_html/css_WEB-ITnose

display: none 不起作用_html/css_WEB-ITnose

WBOY
發布: 2016-06-24 11:15:12
原創
3753 人瀏覽過

<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不起作用呢?


回复讨论(解决方案)

重叠了,前面类的display就无效。


       .reveal * {display: none;}的效果被.reveal *.handle {display: block;}覆盖了

首先,把这个注释改了,style标签(即CSS)里面的注释是  /*   */ ,改成 /*本页的css样式*/ 
优先级的问题,.reveal *.handle高于.reveal * {display: none;},优先级高的生效



这个不是 css的注意语法  下面一行 样式就被破坏了

3,4楼正解,谢谢了

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板