如何防止CSS选择器不改变子元素的父元素
我对Jmpress.js slideshow框架中的CSSNOT选择器有问题 它可以很好地使我的非活动幻灯片不透明。但这也影响了我的活动子幻灯片中存储的父幻灯片，因此我的子幻灯片显示为不透明，即使它是活动的 我已经包括了正在发生的事情的视频 适合层次结构的幻灯片应如何可见的示例如何防止CSS选择器不改变子元素的父元素,css,css-selectors,Css,Css Selectors,我对Jmpress.js slideshow框架中的CSSNOT选择器有问题 它可以很好地使我的非活动幻灯片不透明。但这也影响了我的活动子幻灯片中存储的父幻灯片，因此我的子幻灯片显示为不透明，即使它是活动的 我已经包括了正在发生的事情的视频 适合层次结构的幻灯片应如何可见的示例 这是有道理的，但我想会有很多父母/子女关系。它就像一个菜单层次结构 因此，如果我在子幻灯片上，那么我希望它的父幻灯片（变得不透明从而影响其子幻灯片）不受影响，尽管其他幻灯片都设置为不透明 A A1 A2 B B
这是有道理的，但我想会有很多父母/子女关系。它就像一个菜单层次结构 因此，如果我在子幻灯片上，那么我希望它的父幻灯片（变得不透明从而影响其子幻灯片）不受影响，尽管其他幻灯片都设置为不透明
- A
- A1
- A2
- B
- B1
- B2
- C
/*大量的CSS加*/
.步骤：未（.active）{
不透明度：0.3；
}
我的幻灯片
我的下一张幻灯片
大卫
你管
$（函数（）{
$（“#演示文稿”）.jmpress（）；
});
Blow-Blow您可以使用另一个css规则来匹配非活动父级中的活动div，并对其应用1.0不透明度，如下所示：
.step:not(.active) {
opacity: 0.3;
}
.step:not(.active) div.active {
opacity: 1.0;
}
这应该可以满足您的需要。您可以使用另一个css规则来匹配非活动父级中的活动div，并对其应用1.0不透明度，如下所示：
.step:not(.active) {
opacity: 0.3;
}
.step:not(.active) div.active {
opacity: 1.0;
}
这应该可以满足您的要求。感谢Nelson的回复，您提供的选择器帮助解决了问题，但最终我的问题需要通过以下方式解决 CSS不透明度的问题 当我们向该代码影响的html元素添加子元素时，就会出现问题。所有子元素都将继承相同的不透明度设置，即使您尝试为所有这些元素指定完全不透明度（这无论如何都太麻烦了） 我的代码现在有一个父面板的包装器对象，子面板位于包装器面板的外部，但位于幻灯片本身的内部
<slide id="step_3">
<div class="panel">
<a name="step3"></a>
<h2 class="StepTitle">Multi Slides</h2>
</div>
<slide id="step_4">
<div class="panel">
<a name="step4"></a>
<h2 class="StepTitle">You Tube</h2>
</div>
</slide>
<slide id="step_5">
<div class="panel">
<a name="step5"></a>
<h2 class="StepTitle">IFrame</h2>
</div>
</slide>
</slide>
多幻灯片
你管
内嵌框架
<slide id="step_3">
<div class="panel">
<a name="step3"></a>
<h2 class="StepTitle">Multi Slides</h2>
</div>
<slide id="step_4">
<div class="panel">
<a name="step4"></a>
<h2 class="StepTitle">You Tube</h2>
</div>
</slide>
<slide id="step_5">
<div class="panel">
<a name="step5"></a>
<h2 class="StepTitle">IFrame</h2>
</div>
</slide>
</slide>
多幻灯片
你管
内嵌框架