基金會：是否使用建議的自定義網格計數？

Question

我是後端開發人員，也是基金會以及CSS的新成員。如果設計人員在設計時沒有考慮網格結構，我就會發現很少有前端開發人員在將設計轉換爲CSS時經常遇到困難。這通常發生是因爲12個網格（默認）列結構不提供根據需要準確放置元素的靈活性。

因爲基金會提供給我們使用自定義網格計數，使用它是明智的嗎？大部分網格結構使用12個網格列，因爲12是很好的數字。如果我們使用具有相同排水溝的60格網格柱結構，那麼我們將如何使用12格網格（例如，排水溝爲20px）呢？我相信它應該給我們更多的靈活性來放置元素。

讓我解釋一下。假設我們的網頁需要三列結構，比例爲3：3：4，我不想留下任何偏移量。我不知道我們如何使用12個網格列來實現這一點，除了手動定位元素。但是在60格的列中，我們可以很容易地實現這一點，通過使用大的18，大18，大24，根據需要排水溝，說20px。

有些人可能會說，如果我們在60格的列結構中使用20像素的格線，那麼列之間的間距將佔用網頁的大部分空間。但是，不，在我們使用實際的列之前，排水溝是虛構的。所以這裏只用3個水槽的空間，剩下的就是3：3：4的柱子。

這正是我對網格結構的理解。有更多知識的人可以讓我知道，如果我所假設的事實際上有意義或者有其他一些我缺少的觀點，並且如果我使用60格結構可能會困擾我？

Answer 1

偉大的問題。

我絕對沒有專家，但我已經使用了基金會相當多。我假設你在使用Foundation 6.有幾種方法可以完成這些任務，並且我已經在項目中成功地使用了這兩種方法。

第一種方法是將默認網格更改爲適合維護的列數。就個人而言，我曾經使用過的最多的是24列的佈局。它足夠靈活以適應大多數佈局。在_settings.scss更改此：

$grid-column-count: 24; 

如果是，通常不會爲你足夠靈活，你可以使用常規的網格，也使自定義網格，並用類調用它。這樣，您就可以在大多數頁面上使用常規的12/24列網格，但可以在特殊情況下調用自定義網格。 http://foundation.zurb.com/sites/docs/grid.html#grid-row

@include grid-row($columns, $behavior, $width, $cf, $gutter) { } 

最後，如果你不希望使用任何特殊的東西，你可以在你列使用百分比，並省略標準large-＃列類。所以，你的自定義SCSS會是這個樣子：http://foundation.zurb.com/sites/docs/grid.html#columns

.special-column{ 
    @include grid-column(30%); 
} 
.slightly-larger-column{ 
    @include grid-column(40%); 
} 

不知道這是否回答你所有的問題，但聽起來像有儘可能最佳實踐只是一些困惑？你可以讓你的網格儘可能大，但你必須保持它的任何方式。