Susy 非移动优先

Question

有没有办法让 Compass Susy 从大宽度到移动都工作？

我首先了解移动设备以保持文件大小较小等，但从布局的角度来看，肯定构建一个完整的桌面版本并让断点删除较窄宽度的项目是最好的吗？

有什么想法吗？

Answer 1

是的，你可以。实际上，我发现使用移动向上的建筑布局要容易得多，因为这让我在布局之前考虑内容。我认为从绝对最小开始并根据需要在每个步骤中添加是一个更好的过程。也就是说，Susy 将使用您喜欢的任何流程。只需为您的媒体查询使用最大宽度而不是最小宽度。

at-breakpoint mixin 接受由三部分组成的参数：$min $layout $max。您可以传递除 max-only 之外的任何组合。以与移动优先相同的方式执行此操作，只是减小最大宽度而不是增加最小宽度。 susy 默认值实际上是为桌面优先方法设置的。只需添加断点即可！

.page {
  @include container;
  @include at-breakpoint(9 40em) { /* a 9-column grid with max-width of 40em */ }
  @include at-breakpoint(6 20em) { /* a 6-column grid with max-width of 20em */ }
}