Bootstrap - 如何在屏幕无限大时智能增加列数？
Bootstrap - how to increase columns intelligently when the screen get indefinitely large?
我将下面的 classes 用于大屏幕和超大屏幕：
col-xl-4 col-lg-6 col-sm-12
它在超大 屏幕上创建了3 列，这很棒。但是 第一个问题 是当涉及到 超大 屏幕时 - 它会 始终保持 在 3 列.
当屏幕变大并无限大时，如何增加列数？
例如 - 取决于屏幕尺寸，
col-xxl-5
col-xxxl-6
col-xxxxl-7
col-xxxxxl-8
虽然 第二个问题 是您可以看到我手动添加 class col-xxxxxl-8 这并不理想。那么，有没有办法智能地做到这一点？
或者 Foundation 可以做得更好吗？？
这是我正在处理的entire code。
我不是 Bootstrap 的粉丝，但我知道 ZURB 的基础可以声明更大的断点（也称为媒体查询），因此您可以在超大屏幕上设置代码样式。如此处所述：http://foundation.zurb.com/sites/docs/media-queries.html#changing-the-breakpoints
$breakpoints: (
small: 0px,
medium: 640px,
large: 1024px,
xlarge: 1200px,
xxlarge: 1440px,
);
那么，你可以使用这样的东西：
<div class="row">
<div class="small-6 medium-3 xxlarge-4 columns"></div>
<div class="small-6 medium-3 xxlarge-4 columns"></div>
</div>
请记住，您必须使用 SASS 版本的基础。
我将下面的 classes 用于大屏幕和超大屏幕：
col-xl-4 col-lg-6 col-sm-12
它在超大 屏幕上创建了3 列，这很棒。但是 第一个问题 是当涉及到 超大 屏幕时 - 它会 始终保持 在 3 列.
当屏幕变大并无限大时，如何增加列数？
例如 - 取决于屏幕尺寸，
col-xxl-5
col-xxxl-6
col-xxxxl-7
col-xxxxxl-8
虽然 第二个问题 是您可以看到我手动添加 class col-xxxxxl-8 这并不理想。那么，有没有办法智能地做到这一点？
或者 Foundation 可以做得更好吗？？
这是我正在处理的entire code。
我不是 Bootstrap 的粉丝，但我知道 ZURB 的基础可以声明更大的断点（也称为媒体查询），因此您可以在超大屏幕上设置代码样式。如此处所述：http://foundation.zurb.com/sites/docs/media-queries.html#changing-the-breakpoints
$breakpoints: (
small: 0px,
medium: 640px,
large: 1024px,
xlarge: 1200px,
xxlarge: 1440px,
);
那么，你可以使用这样的东西：
<div class="row">
<div class="small-6 medium-3 xxlarge-4 columns"></div>
<div class="small-6 medium-3 xxlarge-4 columns"></div>
</div>
请记住，您必须使用 SASS 版本的基础。