如何在Zurb Foundation 4/5全屏幕中製作行？

默認情況下，即使在非常大的監視器上，Zurb Foundation 4和5中的行的最大寬度爲1000px，這會在內容的任一側創建邊距。如何在不影響設計響應的情況下全屏運行？如何在Zurb Foundation 4/5全屏幕中製作行？

2013-07-09 BFWebAdmin

接受的答案讓我開始，但我不得不使用這個：body，html，.row {margin：0px;寬度：100％！重要;最小寬度：100％！重要; } –

下面的代碼添加到CSS文件：

2013-07-09 08:47:10 BFWebAdmin

我不喜歡這個，因爲它使整個頁面100％。如果您只打算製作頁腳或頁眉100％，請參閱下面的示例。 – Tom

呃，是的，很明顯;但這不是原來的問題。對於您在評論中提出的問題，您的回答非常有效。 – BFWebAdmin

@BFDatabaseAdmin使用！重要是破壞樣式表的好方法。任何.row.narrow都不能設置最小寬度：50％，因爲某個在stackoverflow註釋線程中的人有一個可接受的答案，即基本.row樣式應該有一個！重要標籤以覆蓋默認的最小寬度在排... – Lotus

如果使用的是薩斯/指南針，zurb-foundation寶石，或定製的基金分配，你可以設置$row-width變量。這將流經其他地方使用。您還可以調整，例如，列數，排水溝寬度等。

2013-11-16 19:44:00 botimer

我認爲要做到這一點的最好辦法是這樣的。

添加到這一點你的CSS或CSS-

.row.full-width { 
    width: 100%; 
    max-width: 100%; 
}

然後在你的HTML自定義，做這個 -

<div class="row full-width"> </div>

這將讓你保持網格系統的機智事件您只想使用全屏幕作爲頁眉或頁腳。

2014-01-17 18:54:16 Tom

-5

<div class="row"> 
    <div class="large-6 columns"></div> 
    <div class="large-6 columns"></div> 
</div>

這會給1000像素

<div class="large-6 columns"></div> 
<div class="large-6 columns"></div>

的寬度，但如果你使用的列級無行類，你會得到全屏...

2014-08-06 13:55:49 user3914633

不添加行失去了Zurb的基本網格結構。 – BFWebAdmin

回答