将自定义字体添加到 GitHub 个页面
Adding custom fonts to GitHub pages
我刚刚在 GitHub 上托管了我的新网站。我在那里使用了一些自定义字体,这些字体是我在 index.html
和 style.css
文件旁边上传的:
字体代码:
@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 的新人,我不知道要更改什么才能使这些字体正常工作。
我也遇到了这个问题。我的字体在本地可以正常工作,但似乎无法在 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)。
样式表文件位于 https://you.github.io/assets/css/style.css when using just a markdown as the index, or README.md as the index. This is wooden-utensil 的一个使用 Cayman 主题的文件,如果你想添加自定义 css,我想你可以添加到该文件,只需保留现有代码因为那样 Cayman 或其他主题将不起作用。不管怎样,我想只需添加
body {
font-family: etc;
}
如果您在 2022 年搜索此内容:
@font-face {
font-family: F16;
src: url("../../SubSkipper/F16_Panel Font.ttf") format('truetype');
font-weight: bold;
font-style: normal;
}
与之前给出的答案相比,我的本地主机配置高出两个级别。
我刚刚在 GitHub 上托管了我的新网站。我在那里使用了一些自定义字体,这些字体是我在 index.html
和 style.css
文件旁边上传的:
字体代码:
@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 的新人,我不知道要更改什么才能使这些字体正常工作。
我也遇到了这个问题。我的字体在本地可以正常工作,但似乎无法在 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)。
样式表文件位于 https://you.github.io/assets/css/style.css when using just a markdown as the index, or README.md as the index. This is wooden-utensil 的一个使用 Cayman 主题的文件,如果你想添加自定义 css,我想你可以添加到该文件,只需保留现有代码因为那样 Cayman 或其他主题将不起作用。不管怎样,我想只需添加
body {
font-family: etc;
}
如果您在 2022 年搜索此内容:
@font-face {
font-family: F16;
src: url("../../SubSkipper/F16_Panel Font.ttf") format('truetype');
font-weight: bold;
font-style: normal;
}
与之前给出的答案相比,我的本地主机配置高出两个级别。