我正在做一个新项目并开始使用 grunt-sass 而不是 grunt-contrib-sass,因为它更快。我还删除了指南针。现在的问题是我再也找不到添加“susy”网格和“断点”的方法了。我曾经把它放在一个 config.rb 文件中,但我不再使用它了,因为我没有使用指南针。
所以我在我的项目中添加了所有 susy 风格,效果很好,但这不是我喜欢的方法。但是找不到添加断点的方法。
有没有办法添加这些?还是我必须为此使用指南针?
对不起我的英语不好,不是很擅长。
我正在做一个新项目并开始使用 grunt-sass 而不是 grunt-contrib-sass,因为它更快。我还删除了指南针。现在的问题是我再也找不到添加“susy”网格和“断点”的方法了。我曾经把它放在一个 config.rb 文件中,但我不再使用它了,因为我没有使用指南针。
所以我在我的项目中添加了所有 susy 风格,效果很好,但这不是我喜欢的方法。但是找不到添加断点的方法。
有没有办法添加这些?还是我必须为此使用指南针?
对不起我的英语不好,不是很擅长。
不需要 Compass,有一个新的susy-media
断点 Mixin 旨在与 LibSass 一起使用,这就是您通过 grunt-sass 使用的。这就是我使用的,效果很好。因此,您将在 _vars.scss 部分中定义一些 Susy 网格变量和断点,例如:
// Define susy.
$susy: (
columns: 12,
gutters: .8,
);
// Define some breakpoints.
$bp-narrow: 30em; // 480px
$bp-med: 48em; // 768px
现在把它们放在一起,例如在 _layout.scss 中:
// the breakpoint (media query)
@include susy-media($bp-med) {
// now a grid
.l-foobar-wrap {
.foo {
@include span(7)
}
.bar {
@include span(5 at 8)
}
}
}
欲了解更多信息,请阅读 susy 文档,这一切都适合您,并且适用于 grunt-sass (LibSass)。这是我日常工作流程的一部分。
请注意,作为非常好的媒体查询渲染和视网膜工作流程的替代方案,我现在使用Include Media而不是susy-media
它也适用于 LibSass。