2011-11-03 113 views
1

我想知道如何显示包含在具有“display:none”特性的父元素中的元素。但是不要让其他孩子留在父母之下。这里有一个简单的例子:重写CSS样式的父元素而不影响其他元素

<div id="parent"> 
    <p id="item1">Item should show</p> 
    <p id="item2">Item should show</p> 
    <p id="item3">Item should not show</p> 
<div><!--/parent--> 

<style> 
    #parent {display: none;} 
    #item3 {display: block !important;} 
</style> 

因此,在这个例子中,我要显示#项目3,但#parent的休息和它的孩子们不显示。我知道有些解决方法涉及到更改每个单独项目的CSS,但我正在处理几十个项目,并且想知道这是否可能,即使通过JS。提前致谢。

回答

3

你为什么不改用:

#parent>p{display:none;} 
#item3{display:block;} 

这样,所有P孩在你的父母将无法显示,但具体项目3#意志。

0

如果隐藏父项目,则无法显示子项目。

为什么不隐藏不需要的子项目并只显示那些想要显示的项目。

<div id="parent"> 
<p id="item1" class="hide">Item should show</p> 
<p id="item2" class="hide">Item should show</p> 
<p id="item3" class="show">Item should not show</p> 

而且你的CSS会。

.hide{display:none;} 
.show{display:block; }