SASS - 它的父母和其父母的另一个孩子的巢子

我正在构建一个flexbox网格，并希望在它的直接父级（网格）和另一个父母中都有一个元素（列）作为子元素儿童（嵌套）。SASS - 它的父母和其父母的另一个孩子的巢子

我的问题：有没有一种SASS方法可以在保持DRY的同时实现这个功能？当前的实现如下所示：

.grid{ 
    ... 

    .nested{ 
     ... 

     .columns{ 
      ... 
     } 
    } 

    .columns{ 
     ... 
    } 
}

2017-08-07 CoJanks

.grid，.nested {??设置公共属性 –

是的，如果没有任何特定的sass特性，那将是我将要解决的问题。（我认为我正在过分抨击它，而忽略了奥卡姆的剃刀） – CoJanks

只需使用外部的一个.nested即可。

它将编译为.grid .columns，它将适用于.grid内部的所有.columns，包括.grid .nested以内的那些。

但是如果你因为某些原因需要有.grid .nested .columns太多，你可以这样做：

.grid{ 
    ... 
    .nested{ 
     ... 
    } 
    &, .nested { 
     .columns{ 
      ... 
     } 
    } 
}

2017-08-07 16:09:53

您可以先设置样式.grid .column和后nested元素中为colums，添加必要的样式。因此，你是干的，因为那些将级联的样式.grid .columns

2017-08-07 16:17:07

回答