我可以将切换CSS应用到多个元素吗？

一般情况下，我可以申请CSS规范的多个元素，例如：我可以将切换CSS应用到多个元素吗？

.class1, .class2, #tag1, #tag2 { 
margin: 10px; 
color: black; 
etc: etc; }

在我目前的js代码的项目，我使用body.className开关的作用。如果className设置为“观看”某些事情发生在代码的不同部分，如：

.viewing #content {padding: 0} 
.viewing #footer {display:none} 
.viewing #nav {display:none}

我的问题是是否有东西结合像.viewing #footer和viewing #nav的方式 - 是这样的：

.viewing #footer, #nav {display:none);

来源

2017-03-22 Bewildered

是的，但你必须做的：

.viewing #footer, .viewing #nav {display:none);

来源

2017-03-22 17:04:52 dzylich

你可以做这样的事情：

tag#id.class

或在您的情况.class#id 例如：

.my-class#my-id, .my-class#other-id

来源

2017-03-22 17:05:14 Xing

不与CSS本身，你不得不重复.viewing部分：

.viewing #footer, .viewing #nav { 
    /* Rules to apply to #footer and #nav when an 
     ancestor element (like body) has .viewing 
    */ 
}

Sass，Less，这种提供更丰富选择机制，然后将它们编译为纯CSS以便传送到浏览器，您可以查看它们。

例如，使用萨斯的SCSS，你可以写这样的：

/* This is SCSS, not CSS */ 
.viewer { 
    #footer, #nav { 
     /* Rules to apply to #footer and #nav when an 
      ancestor element (like body) has .viewing 
     */ 
    } 
}

萨斯将预处理的是，输出的CSS兼容的规则。

来源

2017-03-22 17:05:18

它们有drafted是一个用于在CSS中嵌套支持的模块，由于它尚未被引入，所以你不能仅仅使用CSS本身来做到这一点，就像T.J.已经写了。

即使使用像Sass和其他CSS预处理器，您也无法实现这一目标，因为它们最终会为您编译CSS，如您现在所知，它不支持除Media Queries之外的嵌套。

来源

2017-03-22 18:09:56

我可以将切换CSS应用到多个元素吗？

回答

相关问题