首页  >  文章  >  web前端  >  display: none 不起作用_html/css_WEB-ITnose

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

WBOY
WBOY原创
2016-06-24 11:15:123676浏览

<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楼正解,谢谢了

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn