0

锄头你改变了uikit的默认字体吗?UIKit

默认字体是

"Helvetica Neue",Helvetica,Arial,sans-serif 

及其在 html 元素标签上的设置。如果我将 html 标记中的自定义样式上的此字体更改为其他字体,它不会覆盖更改。我可以使用重要的东西来改变事情:

html {
     font: 'Raleway', sans-serif !important;
}

这会按预期更改全局字体,font-awesome 显然不再有效,因为 !important 写得太多了。有任何想法吗?

4

5 回答 5

5

这已经很老了,但无论如何我都会发布当前的工作答案,以防其他人需要它用于第 3 版,如此所述:

// 1. Your custom variables and variable overwrites. If you are using google fonts,
//follow their instructions as normal as well. (add a link in the html for example).
$global-font-family: 'Ubuntu', sans-serif;

// 2. Import default variables and available mixins.
@import "../../node_modules/uikit/src/scss/variables-theme.scss";
@import "../../node_modules/uikit/src/scss/mixins-theme.scss";

// 3. Import UIkit.
@import "../../node_modules/uikit/src/scss/uikit-theme.scss";
于 2018-07-08T18:02:37.750 回答
1

我认为最简单,也许最干净的方法就是这样。但是,我会小心性能...

* { font-family: 'Raleway', sans-serif; }
于 2018-02-24T00:47:02.500 回答
1

使用来自 uikit 页面的定制器。http://getuikit.com/docs/customizer.html查看正文字体系列,标题字体系列选择。

或者使用 scss/less 版本并享受 uikit-variables.scss 的乐趣,有变量 $base-body-font-family, $base-heading-font-family 。

于 2016-02-24T08:24:02.993 回答
1

您需要做的就是在 uikit 的 css之后包含一个自定义 css 文件,无论您是从 CDN 还是本地调用 uikit -

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uikit/3.0.0-beta.18/css/uikit.min.css" />
<link rel="stylesheet" href="/site/templates/css/app.css" />

在您的 app.css 中执行此操作

html{
  font-family: 'Raleway', sans-serif;
}

你应该很高兴。Font-Awesome 根本不应该受到影响。

于 2017-03-29T13:44:09.873 回答
0

在 html 中使用新的 font-family 对我有用,而无需添加!important或破坏 fontawesome。

https://jsfiddle.net/95sff36a/

也就是说,我通常更喜欢对body这样的标签进行编辑

body{
    font-family: 'Raleway', sans-serif;
}

注意:这不会对标题生效,您可能需要明确添加它们。

于 2016-02-23T08:49:35.300 回答