媒体查询而不是

【问题标题】：media query and not媒体查询而不是
【发布时间】：2013-08-29 22:49:12
【问题描述】：

我有以下更少的代码：

@mobile: ~'screen and (max-width: 480px)';

那我使用如下：

@media @mobile {  
  // some code
}

它工作正常，但我也想使用“不”：

@media not @mobile {  
  // some code
}

但我得到了错误

ParseError: Unrecognised input

在“不是”部分。

有办法解决吗？

【问题讨论】：

【解决方案1】：

也许你可以这样做：

定义移动设备的宽度：

@mobileWidth: 480px;

那么任何更大的东西都是非移动设备：

@notmobileWidth: @mobileWidth + 1px;

为 mobile 和 notmobile 创建 LESS 变量：

@mobile: ~'screen and (max-width: @{mobileWidth})';
@notmobile: ~'screen and (min-width: @{notmobileWidth})';

然后在您的媒体查询中使用它们：

@media @mobile {
  // some mobile code
}

@media @notmobile {
  // some not-mobile code
}

【讨论】：