在本章中，我们将研究全球风格. Foundation框架的全局CSS包括有用的重置，确保样式在浏览器中保持一致.
字体大小调整
浏览器样式表的字体大小默认情况下设置为100％.默认字体大小设置为16像素.根据字体大小，计算网格大小.要具有不同的基本字体大小和未受影响的网格断点，请将 $ rem-base 设置为 $ global-font-size 值，该值必须以像素为单位.
颜色
links 和 buttons 等交互式元素使用来自SASS变量
SASS参考
变量
下表列出了SASS变量，用于自定义项目 _settings.scss 中组件的默认样式.
| Sr.No. | 名称&说明 | 输入 | 默认值 |
|---|---|---|---|
| 1 | $全局宽度 它表示网站的全局宽度.用于确定网格的行宽. | 数字 | rem-calc(1200) |
| 2 | $ global-font-size 它表示应用于<的字体大小; html> 和< body> .它默认设置为100％，用户的浏览器设置值将被继承. | Number | 100％ |
| 3 | $ global-lineheight 它代表所有类型的默认行高. $ global-lineheight 为24px，而 $ global-font-size 设为16px. | 数字 | 1.5 |
| 4 | $ primary-color 它为交互式组件(如链接和按钮)提供颜色. | 颜色 | ＃2199e8 |
| 5 | $ secondary-color 它与支持 .secondary 类的组件一起使用. | 颜色 | ＃777 |
| 6 | $ success-color 它表示与 .success 类一起使用时的正状态或操作. | 颜色 | ＃3adb76 |
| 7 | $ warning-color 它表示与 .warning 类一起使用时的警告状态或操作. | 颜色 | ＃ffae00 |
| 8 | $ alert-color 当与 .alert 类一起使用时，它表示负面状态或操作. | 颜色 | ＃ec5840 |
| 9 | $浅灰色 它用于浅灰色UI项目. | 颜色 | ＃e6e6e6 |
| 10 | $ medium-grey 它用于中灰色UI项目. | 颜色 | ＃cacaca |
| 11 | $ dark-grey 它用于深灰色UI项目s. | 颜色 | ＃8a8a8a |
| 12 | $ black 它用于黑色UI项目. | 颜色 | ＃0a0a0a |
| 13 | $ white 它用于白色UI项目. | 颜色 | #fefefe |
| 14 | $ body-background 它代表身体的背景颜色. | 颜色 | $ white |
| 15 | $ body-font-color 它代表身体的文字颜色. | 颜色 | $ black |
| 16 | $ body-font-family 它代表正文的字体列表. | 列表 | 'Helvetica Neue'，Helvetica，Roboto，Arial，sans-serif |
| 17 | $ body-antialiased 通过使用CSS属性 -webkit-font-smoothing 和将此属性设置为 true 来启用抗锯齿类型-moz-osx-font-smoothing . | Boolean | true |
| 18 | $ global-margin 它代表组件的全球保证金价值. | 数字 | 1rem |
| 19 | $ global-padding 它表示组件的全局填充值. | Number | 1 rem |
| 20 | $ global-margin 它代表组件之间使用的全球保证金值. | 数字 | 1rem |
| 21 | $ global-weight-normal 它代表正常类型的全局字体粗细. | 关键字或数字 | 正常 |
| 22 | $ global-weight-bold 它表示粗体类型的全局字体粗细. | 关键字或数字 | 粗体 |
| 23 | $ global-radius 它表示具有边界半径的所有元素的全局值. | 数字 | 0 |
| 24 | $ global-text-direction 它设置文本CSS的方向 ltr 或 rtl | ltr |