css - 网格布局——我为什么要使用它，我应该使用像 Bootstrap 或 Foundation 这样的框架吗？

Question

我有使用 Twitter Bootstrap 和 Foundation 的经验，我个人认为我唯一想使用的是他们的网格系统。其他功能只是臃肿。

所以我读到了关于网格布局的前景。我发现的所有文章都以“艺术”解释(黄金比例等)为导向。我本质上是一名编码员，我需要一个清晰且合乎逻辑的理由来使用网格布局(例如:“列可以在移动屏幕上轻松地堆叠在一起，并在更大的屏幕上水平扩展”)。有人可以告诉我在我的网站上应用网格系统的优缺点吗？个人觉得用网格系统好吗？

如果答案是肯定的，我应该使用像 Twitter Bootstrap/Foundation 这样的预制网格系统，还是自己制作一个？所有其他功能对我来说都是不必要的，与我的问题无关。

谢谢! :D

Answer 1

我同意@kunalbhat 的观点，这可能不是问这个问题的最佳领域，但既然你问了，我会尽力回答。

网格的设计考虑到了速度和适应性。多种感官的速度。速度的第一部分是写代码的速度。当您使用网格系统并且一切都正确对齐时，您可以轻松获得所需的布局。您不必记住您的表格和列以及 col-spans 等。

第二个速度是修改你的代码。您不可避免地需要返回并进行更改，使用网格很容易做到这一点。将 col-md-7 更改为 col-md-6 可以轻松地对页面布局进行一些调整，这些调整可以轻松跟踪和执行。

你提到了响应式设计，Bootstrap 和 Foundation 都有响应式网格。网格将根据视口(viewport)大小捕捉到不同的大小。但是，您也可以控制。例如，如果您希望某些东西在桌面上占屏幕的 1/12，在平板电脑上占 1/4，在手机上占 100%，这可以使用 Bootstrap 和 Foundation 轻松完成，两者都有针对特定视口(viewport)的网格类。

它们还提供基于这些视口(viewport)的可见性类。

对于容易解决的“臃肿”部分。使用 SCSS，您可以轻松地只导入库的一部分。例如，对于我正在进行的一个元素，我只导入了 Grid，而且它要小得多。