文章/答案/技术大牛

发布

社区首页 >问答首页 >向Jekyll github页面添加计算机现代服务器

问向Jekyll github页面添加计算机现代服务器
EN

Stack Overflow用户

提问于 2022-02-20 20:34:04

回答 1查看 162关注 0票数 0

我正在使用一个分叉版本的jekyll github 页面，并希望添加计算机现代Serif字体作为所有页面的正文字体。我从这里下载了回答解释的所有文件到fonts/Serif文件夹中。然后，我将以下代码添加到_includes/ext-css.html文件中

<head>
    <meta charset="UTF-8" />
    <title>Test</title>
    <!-- Computer Modern Serif-->
    <link rel="stylesheet" href="fonts/Serif/cmun-serif.css"></link>
    ...
</head>

我还在assets/css/beautifuljekyll.css文件中添加了以下行(第13行)

body {
  font-family: 'Lora', 'Times New Roman', serif;

但是，我仍然无法在所有的页面上获得这个字体。我应该添加/删除其他的东西来使这个工作吗？我是github页面和html的新手，所以请帮助我

github-pages

webfonts

html

css

jekyll

回答 1

Stack Overflow用户

回答已采纳

发布于 2022-02-22 18:18:09

经过几次讨论(多亏了阿拉谢尔)，我找到了解决这个问题的方法。

在_includes/ext-css.html文件中添加/fonts/，而不是只添加字体，即将代码作为

<head>
    <meta charset="UTF-8" />
    <title>Test</title>
    <!-- Computer Modern Serif-->
    <link rel="stylesheet" href="/fonts/Serif/cmun-serif.css"></link>
    ...
</head>

在assets/css/beautifuljekyll.css文件的第13行，将其更改为

body {
  font-family: 'Computer Modern Serif','Droid Sans', Helvetica, Arial, sans-serif;

而且，在同一个文件中，在第13行(主体开始之前)之前添加以下代码

//*********************** Fonts ********************//

@font-face {
    font-family: 'Computer Modern Serif';
    src: url('../../fonts/Serif/cmunrm.eot');
    src: url('../../fonts/Serif/cmunrm.eot?#iefix') format('embedded-opentype'),
         url('../../fonts/Serif/cmunrm.woff') format('woff'),
         url('../../fonts/Serif/cmunrm.ttf') format('truetype'),
         url('../../fonts/Serif/cmunrm.svg#cmunrm') format('svg');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'Computer Modern Serif';
    src: url('../../fonts/Serif/cmunbx.eot');
    src: url('../../fonts/Serif/cmunbx.eot?#iefix') format('embedded-opentype'),
         url('../../fonts/Serif/cmunbx.woff') format('woff'),
         url('../../fonts/Serif/cmunbx.ttf') format('truetype'),
         url('../../fonts/Serif/cmunbx.svg#cmunbx') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Computer Modern Serif';
    src: url('../../fonts/Serif/cmunti.eot');
    src: url('../../fonts/Serif/cmunti.eot?#iefix') format('embedded-opentype'),
         url('../../fonts/Serif/cmunti.woff') format('woff'),
         url('../../fonts/Serif/cmunti.ttf') format('truetype'),
         url('../../fonts/Serif/cmunti.svg#cmunti') format('svg');
    font-weight: normal;
    font-style: italic;
}


@font-face {
    font-family: 'Computer Modern Serif';
    src: url('../../fonts/Serif/cmunbi.eot');
    src: url('../../fonts/Serif/cmunbi.eot?#iefix') format('embedded-opentype'),
         url('../../fonts/Serif/cmunbi.woff') format('woff'),
         url('../../fonts/Serif/cmunbi.ttf') format('truetype'),
         url('../../fonts/Serif/cmunbi.svg#cmunbi') format('svg');
    font-weight: bold;
    font-style: italic;
}

随着以上两个代码的添加，如果您按照问题中的步骤，这只剩下添加fonts/Serif文件夹到主回购从链接，你是好的！

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/71198520

复制

相似问题

问向Jekyll github页面添加计算机现代服务器
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问向Jekyll github页面添加计算机现代服务器EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问向Jekyll github页面添加计算机现代服务器
EN