I.自定义暗黑模式

本站使用了anatole-zola主题，本主题中作者并未给出自动的按时间切换功能，只有简单的按照配置文件控制暗黑模式。

怎么办呢？ 答：自己理解网页的布局，改一下。

step1. 观察basic.html

发现里面存在类似于C预编译器的

#ifdef
#elif defined
#endif

语句，也就是说，在config.toml里写的配置将决定什么代码被采用

step2. 添加新的配置项目，我将其命名为automode

step3. 对于对应的配置项目，编写对应的js代码，在上文底下编写对应的elseif模版，插入如下代码

window.onload = ()=>{
    const date = new Date();
    const time = date.getHours()*60+date.getMinutes();
    const theme = time >=19*60?"dark":"light";
    const ptr=document.getElementsByTagName("html")[0].classList;
    ptr.remove("theme--light");
    ptr.add("theme--"+theme);
}

由此实现了暗黑模式的自动切换

II.自定义字体

你是否注意到了本站介绍页的字体，其实并不是网上的字体，而是我私有的。

For example, this one.

如何将自己的ttf字体用在自己的网页中呢？

step1. 上传ttf到webfont-generator中，并点击处理、下载

step2. 编写自己的字体css文件

@font-face {
    font-family: "Your Font";
    src: url("url://link.to/your_font.woff2") format("woff2");
    src: url("url://link.to/your_font.woff") format("woff");
    src: url("url://link.to/your_font.eof")
}

step3. 在需要的网页中引用自己的css文件，然后使用的时候如下

<p style="font-family:'Your Font'">something</p>