自定义媒体功能

Question

我有一个网页，我希望能够以两种不同的方式显示。此页面上的元素有两组样式，每种样式对应一种显示方式。我希望能够在javascript中轻松地将所有元素的样式从一组样式切换到另一种样式。

我还想拥有它，所以如果屏幕宽度低于某个阈值，则只能使用第二组样式。

我想知道是否有设置自定义媒体功能，所以我可以像这样定义我的样式：

@media (custom-feature: 'first-set') and (min-width: 700px) {
  /* first set of styles goes here */
}
@media(custom-feature: 'second-set'), (max-width : 700px) {
  /* second set of styles goes here */
}

然后在我的javascript中执行类似的操作：

setMediaFeature('custom-feature', 'second-set')

看起来这可能是Media Queries 4的一部分，但我想知道现在是否有办法达到同样的效果。