Question

我第一次使用Less和Meteor。一切都很酷，除了我试图让媒体查询工作受到阻碍。

我有一系列的媒体查询结构如下：

/* Desktops and laptops ----------- */ 
@media only screen  and (min-width : 1224px) {   
@columns: 12;
  .full() {
    width: 100%;
  }
  .container(){
    .center(12);
  }
  .main-col() {
    .column(9);
    .push(0);
  }
  .side-col(){
    .column(3);
    float:right;
  }
  .nested-left-col(){
     .nested-left(6) 
   }
  .nested-right-col(){
     .nested-right(3);
  }
}

但是当编译css时，我得到的就是：

/* Desktops and laptops ----------- */

奇怪的是，除了评论之外什么都没有的媒体查询按预期编译：

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  /* Styles */
}

我很确定这些媒体查询被视为永远不会被调用的变量。

我只是做错了吗？我有什么不可思议的明显缺失吗？我一直在寻找答案半小时，但找不到任何有同样问题的人。这种情况表明我错过了显而易见的事情，但也许我遇到了一些不同寻常的事情。

Answer 1

知道了。

我最初以不同的方式接近这些mixin并且会使它们参数化，所以他们有（）。在我改变了方法之后，我没有费心去除（），因为只要我直接在CSS中调用它们进行布局测试，它就没有传递任何值。但当我将它们移动到媒体查询中时，它们不再被调用，我得到了空白输出。

删除（）s，使它们不再被评估为参数化修复它。

我仍然没有得到@columns变量的输出，但我尝试做的是重新声明全局值。我有点期待无论如何都不会工作，所以我会找到一种不同的方法。

感谢。非常感谢。

Less / Meteor将媒体查询视为变量？

1 个答案: