responsive-design - 如何设置“断点”以使用 zurb 基础网格堆叠一行

Question

假设我在 12 列网格上有一个包含两个元素的行：

<div class="row">
    <div class="three columns">part 1</div>
    <div class="nine columns">part 2</div>
</div>

通常它们并排显示。喜欢：

part1      part2

但如果屏幕小于 XXX，它将显示为好像有 2 行......

part1
part2

zurb基金会能做到吗？或任何其他框架？

编辑：我想自己指定断点（XXX）的值。不仅依赖于默认行为。

Answer 1

如果您想更改断点，则需要修改此处列出的断点：http: //foundation.zurb.com/docs/media-queries.php

/* Medium screens */
@media only screen and (max-width: 1279px) and (min-width: 768px) { ... }

/* Small screens */
@media only screen and (max-width: 767px) { ... }