将自定义字体添加到GitHub页面

时间:2016-03-01 09:14:35

标签: html css github fonts github-pages

我刚刚在GitHub上托管了我的新网站。我在那里使用了一些自定义字体,我在index.htmlstyle.css文件旁边上传了这些字体:

enter image description here

字体代码:

@font-face {
  font-family: "gogoiadeco";
  src: url('gogoia-deco-webfont.eot');
  src: url('gogoia-deco-webfont.eot?#iefix') format('embedded-opentype'),
    url('gogoia-deco-webfont.woff') format('woff'),
    url('gogoia-deco-webfont.ttf') format('truetype'),
    url('gogoia-deco-webfont.svg#Gogoia') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'icomoon';
  src:url('icomoon.eot');
  src:url('icomoon.eot?#iefix') format('embedded-opentype'),
    url('icomoon.woff') format('woff'),
    url('icomoon.ttf') format('truetype'),
    url('icomoon.svg#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'gogoiaregular';
  src: url('gogoia-regular.eot');
  src: url('gogoia-regular.eot?#iefix') format('embedded-opentype'),
    url('gogoia-regular.woff2') format('woff2'),
    url('gogoia-regular.woff') format('woff'),
    url('gogoia-regular.ttf') format('truetype'),
    url('gogoia-regular.svg#gogoiaregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

我是GitHub的新手,我不知道要改变什么来使这些字体有效。

2 个答案:

答案 0 :(得分:4)

我也有这个问题。我让字体在本地正常工作,但似乎无法在GitHub上正确使用。

我想出了如何执行此操作:gitHub.io页面的根目录似乎与本地根目录不同,这导致字体位于错误的文件夹中。

这是我的代码:

@font-face {
    font-family: F16;
    src: url("../SubSkipper/F16_Panel Font.ttf") format('truetype');
    font-weight: bold;
    font-style: normal;
}

SubSkipper是我的项目的名称,.ttf字体在明显的根目录中,我的意思是:" SubSkipper /"

路径../返回一个级别,然后在本地显示项目的根目录(SubSkipper)。

答案 1 :(得分:0)

仅将markdown用作索引,将README.md用作索引时,样式表文件位于https://you.github.io/assets/css/style.cssThiswooden-utensil的使用Cayman主题的名称,如果您想添加自定义CSS,我想您可以将其添加到该文件中,只需保留现有代码,因为Cayman或其他主题将不会出现。工作。无论如何,我想只需添加

body {
    font-family: etc;
}