1

这是 Sassmeister 上的代码，如果链接有任何问题，请告诉我：http: //sassmeister.com/gist/0b7c3a1897fe3bbe33db

我有一个 $tablet 和 $bigscreen 断点，它们使用最小宽度值。

有一个带有 omega(2n) 值的 $tablet 屏幕的媒体查询。然后我有另一个带有 omega(4n) 值的 $bigscreen 断点。我的目标是在 $bigscreen 上每行显示三张图片，在 $tablet 上显示两张图片，在较小的屏幕上显示一张。

如果您检查代码，您可以看到 2n 个 tablet 的值仍然存在于 $bigscreen 上，导致所有块不适合并撞到下一行。这不应该被新的断点覆盖吗？

对 Neat 来说相对较新，如果您有任何建议或有用的提示，将不胜感激！谢谢！

4

1 回答 1

0

你有欧米茄的问题，omega(4n)断点的$bigscreen不要覆盖omega(2n)平板电脑的断点。

对于解决方案，您可以检查Omega Reset。在您的 sass 中包含 mixin 并执行以下操作：

.picture
    +media($tablet)
        +span-columns(6) //6 of 12
        +omega(2n)
    +media($bigscreen)
        +span-columns(4) //4 of 12
        +omega(3n)
        +omega-reset(2n)

媒体查询omega-reset(2n)中的$tablet 断点重置。我最近遇到了同样的问题，这个解决方案效果很好。$bigscreenomega(2n)

于 2014-06-30T20:33:25.300 回答