整洁的新断点答案

【问题标题】：Neat new-breakpoint整洁的新断点
【发布时间】：2014-06-30 14:40:19
【问题描述】：

我正在使用整洁的波旁威士忌并尝试使用它的新断点混合，但它不起作用。我已经可以说我加载了第一个波旁威士忌，而不是 grid 和 breakpoints.scss，而不是整洁

所以我在写的时候可以看到变化：

@include media(max-width 500px) {
          @include span-columns(12); 
          background: red;
        }

但不是在我写的时候：

$mobile: new-breakpoint(max-width 500px);
@include media($mobile) {
            @include span-columns(4);
             background: red;
          }

知道为什么吗？

【问题讨论】：

标签： sass neat

【解决方案1】：

尝试像这样在new-breakpoint 声明中定义列数：

$mobile: new-breakpoint(max-width 480px 4);

如果在常规 css 之后导入响应式 css，也会出现问题。

最后，您应该将 .scss 输出更改为常规 css（未缩小），以便更好地理解代码。当您必须上传代码时，您可以更改设置并缩小 css。

【讨论】：

【解决方案2】：

您可以将最小值和最大值用于不同的分辨率。假设你需要高达 480，那么你应该去

$mobile: new-breakpoint(max-width 480px 4);

如果你想使用平板电脑，你应该去

    $tablet: new-breakpoint(min-width 481px 8);

确保以 Min 作为上限。

【讨论】：