2016-03-04 106 views
0

时指父我有这个CSS页面之间共享,我只想做一些填充改变其中的一个页面上的其余部分将仍然是相同的。设置CSS元素

我能做到这一点,通过创建我使用的页面一类特殊的,但我要问,如果有通过在页面顶部父增加的情况来处理它一个整洁的方式?

需要改变:如果在页面顶部父母有一定的ID /类名..做填充顶:60像素,而不是30像素,,否则保持30PX

#box-list { 
    padding-top: 10px; 

    @media (min-width: @screen-md-min) { 
    padding-top: 30px; 
    } 
} 

回答

0

如果我是正确的,这将工作。

唯一的条件是,有的#box-list一个id #your-special-page母体。

#box-list { 
    padding-top: 10px; 

    @media (min-width: @screen-md-min) { 
    padding-top: 30px; 

    #your-special-page & { 
     padding-top:60px; 
    } 
    }  
} 
+0

他好像是用较少,但这种解决方案只是正常少为好。只是确认。 –

+0

你说得对。感谢您的确认。 – NiZa

0

尝试这样的:

if (".top parent").hasClass("some_class"){ 

    $("#box-list").css("padding-top", "60px"); 

}else{ 
    $("#box-list").css("padding-top", "30px"); 
} 
0

如果我理解正确你想生成一些CSS是这样的:

#box-list { 
    padding-top: 10px; 
} 
.special-template #box-list { 
    padding-top: 60px; 
} 

在小于或无礼的话你可以写这样的事情:

#box-list { 
    padding-top: 10px; 

    .special-template & { 
     padding-top: 60px; 
    } 
} 

请记住,&唱歌之前引用整个选择器。所以如果你有额外的水平,你可能会在开始时得到一些有线的结果。