Zurb F5：更改基本字體大小和rem-base令人困惑

Question

我希望我的網格在1320px的行內有24列。我也想要我的默認（正文）字體大小設置爲22px。讓我告訴你如何用SASS/SCSS和Zurb基金會輕鬆完成這個任務...等等，什麼？

不容易。基本上無法將「默認」字體大小設置爲除rem-base之外的其他值，而不會打破網格。如果$rem-base: 16px和$base-font-size: 100%一切工作正常 - 我只想要更大的字體。如果$rem-base: 16px和$base-font-size: 22px網格計算爲具有1815px而不是1320px。當然，因爲設置html字體大小設置rem單位和其他所有字體大小指的是rem。

改變線345,346在_global.scss（V 5.2.1）和這樣

html { font-size: $rem-base; } 
body { font-size: $base-font-size; } 

將它們設定爲不同的VARS不影響字體大小的p，UL等

所以這個問題依然存在：如何使用Foundation5 SCSS獲得22px基本大小的1320/24網格？

乾杯

Answer 1

按照_settings.scss文件「如果你希望你的基本字體大小是不同的，沒有它影響電網斷點，設置$ REM-基地$基礎font-size和確保$ base-font-size是一個px值。'

所以這就是我所做的事情和字體大小的增加，但網格保持不變（雖然你將需要因此它的$基本字體大小後，移動$ REM基）

如此這般來自：

// This is the default html and body font-size for the base rem value. 

$rem-base: 16px; 
$base-font-size: 100%; 

要：

// This is the default html and body font-size for the base rem value. 

$base-font-size: 22px; 
$rem-base: $base-font-size; 

這不是我以前做過，但希望它可以幫助你！

Answer 2

如果您需要更改$base-font-size，同時保持網格狀態不變，則必須將$base-font-size和$rem-base設置爲相同的值。沒有必要更改標準基礎_settings.scss中的線條。

E.g.

// This is the default html and body font-size for the base rem value. 
$rem-base: 14px; 

// Allows the use of rem-calc() or lower-bound() in your settings 
@import 'foundation/functions'; 

// The default font-size is set to 100% of the browser style sheet (usually 16px) 
// for compatibility with browser-based text zoom or user-set defaults. 

// Since the typical default browser font-size is 16px, that makes the calculation for grid size. 
// If you want your base font-size to be different and not have it affect the grid breakpoints, 
// set $rem-base to $base-font-size and make sure $base-font-size is a px value. 
$base-font-size: $rem-base;