ZURB Foundation 6 - 媒体查询的变化[关闭]答案

【问题标题】：ZURB Foundation 6 - Changes in Media Queries [closed]ZURB Foundation 6 - 媒体查询的变化[关闭]
【发布时间】：2016-03-05 04:23:16
【问题描述】：

如果您阅读ZURB Foundaiton 6 Media Queries 的文档，您会发现与 ZURB Foundation 5 相比有一些变化。我对新功能几乎没有疑问，因为我不明白导致变化的原因。

1) breakpoint mixin，向下而不是向上

这会导致从版本 5 迁移到版本 6 时遇到困难。为什么没有选项继续使用向上方向？
从上到下改变方向的原因是什么？仍然很常见的是，只有小型设备的样式不同，中型和大型设备使用相同的样式（例如菜单）。再说一次，我不明白为什么没有选择上下关键字的选项。
在移动优先设计方法方面哪个方向更好？这些变化在某种程度上与此有关吗？

2)MediaQuery.atLeast函数，方向不一致

这个函数告诉你屏幕是否有一些尺寸或者大于这个尺寸。这与 breakpoint mixin（使用 down 关键字）完全相反。为什么行为不一样，或者为什么我们别无选择？

【问题讨论】：

我投票决定将此问题作为题外话结束，因为只有开发人员才能回答这些问题，因此这个问题会吸引投机性的答案。
@cimmanon 我希望开发人员在这里阅读带有标签的问题！ :-) 无论如何，我得到的答案没有任何投机性，所以我认为这个问题没问题，不是吗？
您的问题是询问开发人员所做的设计决策。如果你想知道，你应该直接问他们。如果您想知道如何从以前版本的库中获取行为，则应该询问 that。请注意，您得到的答案并没有回答您实际提出的问题。
@cimmanon 他们都没有，我只是很困惑。文档对此只字未提，所以我认为这个问题的答案应该对其他人有用。
@Akarienta 文档在代码示例中解释了这一权利。我的答案中的示例是从文档中复制的。

标签： javascript sass zurb-foundation zurb-foundation-6

【解决方案1】：

您误解了 breakpoint 混音。仅当您在 mixin 的参数中显式添加 down 关键字时，它才会下降。如果您只是为参数输入断点的名称，那么它会从该断点上升，不需要额外的关键字。如果您添加关键字only，那么它只会影响该断点。

这是直接取自Foundation 6 Docs：

.element {
  // Only affects medium screens and larger
  @include breakpoint(medium) { }
  // Only affects medium screens and smaller
  @include breakpoint(medium down) { }
  // Only affects medium screens, not small or large
  @include breakpoint(medium only) { }
}

【讨论】：