CSS网格框架中的排水沟有什么意义？

Question

我正在进入Web开发,我正在使用Blueprint CSS框架,其中包括一个网格系统,我有几个问题.

1. 排水沟有什么意义？当然它们不习惯在列之间包含空格,因为你可以只使用边缘CSS属性,对吧？或者排水沟只是管理利润的一种优雅方式？
2. 我不希望我的列之间有任何空间,并希望生成不包含排水沟的网格布局,但所有生成器工具都阻止我使用零宽度排水沟.这是为什么？
3. 看来不再支持建议的Blueprint CSS生成器.任何人都可以建议使用Blueprint CSS生成器来修改网格以包含零宽度的排水沟吗？

非常感谢你的智慧!

Answer 1

CSS Grid系统背后的动机是完全自动化布局.排水沟通常是理想的,因为柱之间的空白区域可以提高易读性,因此将它们作为自动化的一部分包含在内是有意义的.

发电机的存在理由是为了减轻您实施它们所需的繁琐计算,但如果没有排水沟,数学和css都不会变得复杂.

在没有发电机的情况下进行无沟槽网格应该非常简单.例如

( column width X nº of columns ) + left margin + right margin = content width

.span-1 {width:100px}
.span-2 {width:200px}
.span-3 {width:300px}
.span-4 {width:400px}

etc...

Answer 2

排水沟与CSS本身完全无关.它们是来自印刷出版的设计概念 - 它们旨在提供列之间的空白,使内容更容易阅读.

没有排水沟的柱子很容易计算.只需为每列设置相同的宽度(以像素为单位).