响应mixins宽度与设备宽度

Question

我在sass中使用以下响应式mixin：

@mixin macbook-pro {
  @media (min-width: #{$macbook-pro-width}) and (max-width: #{$desktop-width - 1px}) {
    @content;
  }
}

但是，我设置了字体大小更改的断点。例如，在1920浏览器宽度下，字体大小为18px。随着浏览器宽度的减小，字体大小最终变为14px（以适应更小的屏幕分辨率）。如何确保字体大小与浏览器宽度更改保持一致，但是当屏幕分辨率更改时，字体大小会更改。

所以基本上，我想要它，以便当浏览器宽度为1920px，屏幕分辨率为1920时，字体大小为18px。当您缩小窗口时，字体大小保持在18px。

但是，当屏幕分辨率为1440px且浏览器宽度为1440px时，字体大小为14px。当您缩小窗口时，字体大小在该屏幕分辨率下保持不变。

我尝试使用device-min-width而不是min-width，但我猜测使用它有一些缺点。

Answer 1

您目前使用的字体大小是什么单位？

除非我误解，否则您应该只能在每个分辨率的媒体查询中设置字体大小。

您使用的是px，还是使用基于百分比的大小调整？