将css类组合到目标特定页面

Question

我有一个类.entry-content它有30px的margin在每一页上，我有一个类.double-outter-wrapper即first-child，但只在1或2页。有没有办法只针对那些有.entry-content和.double-outter-wrapper将margin更改为0的页面？

Answer 1

如果您愿意使用JavaScript，JavaScript可能是一个可行的解决方案......如果您在每个页面中都包含一个通用的JavaScript GUI控制器，您绝对可以处理此操作......它就像...

if (document.getElementsByClassName('your-conditional-element').length !== 0) { 
    document.getElementsByClassName('your-element')[0].style.margin = 0; 
} 

Answer 2

跟jquery想要实现一样。所以这里第一课的背景颜色是红色的。在这两种情况下，它有一个类two。因此，选择类two并检查其父项one并将其CSS更改为绿色。您可以添加CSS根据自己的需要像margin:0 下面是一个例子

$(".two").parent(".one").css("background","green");

.one { 
 
    background:red; 
 
    width:90%; 
 
    height:20%; 
 
    margin:30px; 
 
    padding:20px; 
 
} 
 
.two { 
 
    background:blue; 
 
    width:100%; 
 
    height:100%; 
 
} 
 
.three { 
 
    background:orange; 
 
    width:100%; 
 
    height:100%; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="one"> 
 
    <div class="two three"> 
 
    class 1 
 
    </div> 
 
    <div class="three"> 
 
    </div> 
 
    </div> 
 
<div class="one"> 
 
    <div class="two three"> 
 
    </div> 
 
    <div class="three"> 
 
    </div> 
 
    </div> 
 
<div class="one"> 
 
    
 
    <div class="three"> 
 
    </div> 
 
    </div> 
 
<div class="one"> 
 
    
 
    <div class="three"> 
 
    </div> 
 
    </div>