Css 在断点处更改“$column width”，但不更改列数

我看到的大多数Susy示例似乎都处理在给定断点处列数发生变化的情况，即：

$total-columns: 4;
$large: 12;

// code based on 4 columns

@include at-breakpoint($large) {
    // code based on 12 columns
}

但是，如果您希望列数保持不变，但（例如）只更改列宽，该怎么办？像这样：

$total-columns: 12;
$column-width: 3em;

$large: 64em;
$large-column-width: 3.75em;

@include at-breakpoint($large) {
    $column-width: $large-column-width; // automagically changes previously declared column-widths.
}

我希望在断点之前使用

columns（）

或

span-columns（）

自动将其值调整为新列宽，而无需重新声明

所以

不会在断点处更改，但列的宽度会自动更改

---

这可能吗？

Susy 2使用新的解决方案解决此问题。但是Susy 1方法并不复杂。断点处的

mixin是两个操作的简单包装器：

设置媒体查询
更改该媒体查询块内的全局Susy设置
我建议下载Breakpoint（或其他类似的插件）来处理媒体查询方面的事情，但您也可以手动完成。Susy提供了一个mixin来处理第二部分（
，带有网格设置）。如果将这两个功能放在一起，则在断点处有一个功能更强大的

$large: 64em;
$large-column-width: 3.75em;

@media (min-width: $large) {
  @include with-grid-settings($column-width: $large-column-width) {
    // new column-width applied to code in here.
  }
}

$large: 64em;
$large-column-width: 3.75em;

@media (min-width: $large) {
  @include with-grid-settings($column-width: $large-column-width) {
    // new column-width applied to code in here.
  }
}