CSS网格框架百分比

Question

我正在实现一个CSS网格作为一种学习经验，并基于我对以下内容的研究和阅读：

http://css-tricks.com/dont-overthink-it-grids/

基于百分比的网格最有意义，然而，当处理三分之一时，如果分数加起来为100%，这是如何工作的？

33% + 33% + 33%显然是99% --这对在CSS框架中使用thirdds进行网格布局有什么影响(如果有的话)？

最后，为什么这么多框架倾向于关注这么多列单元？例如，YUI Pure支持24个单元，这使得CSS乍一看更难理解，为了什么，提供更多的“像素完美精度”？

对我来说，最多支持4到5列似乎是合乎逻辑的，并在网格中嵌入网格以实现更细粒度的布局控制。

使用网格以任何方式删除像素精度，不是吗？现在每个网站都被分割成4到5个栏目。

意见、经验、建议？

Answer 1

多个问题的几个答案(很好！)你提出的问题：

• 百分比不需要是整数。因此，执行width: 33.3333%可以使您非常接近100%。加起来不到100会让你离全宽稍短一点，但是如果你离得足够近，没有人会注意到。
• 为什么有这么多列？因为内容的大小不同，你的栏越多，你的网格的适应性就越强。这里有一个关于网格的很好的演示文稿，标题是“网格很好(对吧？)”虽然只有几年的历史，但仍然值得一看。这里是a PDF或on slideshare

格式

Answer 2

对于列，它为您提供了对定位元素的更多控制。我通常在桌面布局中使用16网格系统(4,4,4,4)，但如果您希望将其从col_3定位到col_6，它可以做到这一点。

我已经为视觉辅助工具提供了一张图片。

​

​