dppx或min-width组合查询

Question

当我使用@include breakpoint(min-resolution: 1.5dppx)时，

我得到了这个输出：

@media (min-resolution: 1.5dppx), (-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (min-resolution: 144dpi)

这个快捷方式很好，但如果我尝试将它与另一个这样的查询结合起来：

@include breakpoint(min-resolution: 1.5dppx, 2050px)

我完全一样（最后一部分被删除）

然后，如果我添加一些引号：

@include breakpoint("2050px, min-resolution 1.5dppx")

我松开了跨浏览器部分：@media (min-width: 2050px, min-resolution 1.5dppx)

有没有办法将它们成功合并？

Answer 1

当使用直接传递给Breakpoint mixin的or个查询时，需要将整个查询包装在括号中，因为Breakpoint mixin的第二个参数是no-query。您应该写下以下内容：

@include breakpoint((min-resolution 1.5dppx, 2050px)) {}

看看这个SassMeister Example，看看它是否正常运作。