css - 使用最小和最大宽度在 sass 中设置断点

Question

大家好，我正在尝试使用响应式布局，但不知何故我无法修复此布局的最小宽度。

$mobile: new-breakpoint(max-width 480px 4);
$tablet: new-breakpoint(max-width 768px 8);
$desktop: new-breakpoint(max-width 1336px 10);
$desktopxl: new-breakpoint(max-width 1550px 10);

不知何故，我希望 $desktopxl 仅在 1337px 和 1550px 之间使用 但是 我无法设置最小宽度。请帮我。 谢谢。 ps: **我试过了

 $desktopxl: new-breakpoint((max-width: 699px) and (min-width: 520px)10);

但是没用。

Answer 1

您不需要 min 和 mix。 您所需要做的就是在最大宽度旁边做最小值。 像例如。如果你的最大宽度是 700px 下一层最小宽度应该是 701px;

试试这个

$mobile: new-breakpoint(max-width 480px 4);
$tablet: new-breakpoint(max-width 768px 8);
$desktop: new-breakpoint(min-width 779px 10);
$desktopxl: new-breakpoint(min-width 1337px 10);