在scss（或css）中基于活动媒体查询类设置属性

Question

如果我有这样的元素（使用Bootstrap css）：

<div class="col-sm-6 col-md-3 mydiv">
   some text here
</div>

我希望能够做到这样的事情（SCSS中的例子）：

.mydiv {
   &:not(.col-sm-6) {
       font-weight:bold;
   }
   &:not(.col-md-3) {
       text-transform:uppercase;
   }
}

因此col-sm-*和col-lg-*会根据各自的@media查询来处理容器大小，但我还想在其中一个查询处于活动状态时应用某种样式另一个。

示例代码显然不起作用（因为div总是有.col-sm-6和.col-md-3类）。

我知道我可以创建自己的@media查询，或者自定义bootstrap.css媒体查询并将.mydiv添加到它们中，但我有几个模块，并希望将各自的CSS（SCSS）分开，而不必创建每个都有多个@media查询。