带断点的模块化为每个断点生成相同的值



我正在使用 https://github.com/modularscale/modularscale-sass。

我有这个设置:

$font-size-base: 16px;
$modularscale: (
  base: $font-size-base,
  ratio: 1.067,
  768px: (
    ratio: 1.125,
  ),

(;

然后我使用:

h1 {
  @include ms-respond(font-size, 12);
}

但输出 CSS 为两个断点给出相同的字体大小值:

h1 {
  font-size:66px;
}
@media (min-width:768px){
  h1 {
    font-size:66px;
  }
}

仅使用 1.125 比率...

我做错了什么?

谢谢

我写这篇文章是为了适应两个或多个断点的逐渐变化。但是,这需要两个或多个断点,如下所示:

$font-size-base: 16px; $modularscale: ( base: $font-size-base, ratio: 1.067, 450px: ( ratio: 1.067, ), 768px: ( ratio: 1.125, ), );

关于"我做错了什么?

您应该期望该行为与一个断点一起工作是完全有道理的。我将打开一个问题,以按照您的期望进行这项工作。

最新更新