本文记录在用 Jekyll 搭建博客时遇到的一些问题,因为问题比较杂,尚没有太多时间整理,如有疑问欢迎留言。
本地 Run jekyll
jekyll serve -w --host=0.0.0.0
排序需要接续标号
{:start="3"}
TOC 操作
- _includes/toc.html 加上:
<nav>
<h2>Table of Contents</h2>
* this unordered seed list will be replaced by toc as unordered list
{:toc}
</nav>
- 在想要加 TOC 的博文中加入:
{${ \% \text{ include toc.html } \% }$}
_config.yml
需要加入:
kramdown:
parse_block_html: true
jekyll-paginate 依赖问题
当在根目录下运行 jekyll s
时会报如下依赖错误的话:
Dependency Error: Yikes! It looks like you don't have jekyll-paginate or one of its dependencies installed.
直接把 gem
那个设置去掉就行。
公式显示问题
在页面上显示数学公式,这里要在 head.html
中加入如下代码:
<!--MathJax的配置脚本,用于临时简单的配置 -->
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
extensions: ["tex2jax.js"],
<!--输入Latex公式,以HTML和CSS的形式显示输出 -->
jax: ["input/TeX", "output/HTML-CSS"],
tex2jax: {
<!--$表示行内元素,$$表示块状元素 -->
inlineMath: [ ['$','$'], ["\\(","\\)"] ],
displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
processEscapes: true
},
"HTML-CSS": { availableFonts: ["TeX"] }
});
</script>
<!--加载MathJax的最新文件, async表示异步加载进来 -->
<script type="text/javascript" async src="https://cdn.mathjax.org/mathjax/latest/MathJax.js">
</script>
测试公式:内联公式 –> $x^2=y$
换行居中公式:
\[x^2+y^2=1\] 公式中如果有竖线的话可以用 $\vert$
两个花括号连在一起时报错:
The page build failed for the `master` branch with the following error:
The variable `{ {|D^v|}` on line 79
{ {
中间加一个空格即可。如果出现花括号打不出来,那么可以用 \\{
。
以如下形式显示公式在刷新页面时公式显示更加快速:
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
extensions: ["tex2jax.js"],
<!--输入Latex公式,以HTML和CSS的形式显示输出 -->
jax: ["input/TeX", "output/HTML-CSS"],
tex2jax: {
<!--$表示行内元素,$$表示块状元素 -->
inlineMath: [ ['$','$'], ["\\(","\\)"] ],
displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
processEscapes: true
},
"HTML-CSS": { availableFonts: ["TeX"] }
});
</script>
<script type="text/javascript" async
src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-MML-AM_CHTML">
</script>
这种方法值得注意的是 $
方式出现两个下划线会以斜体出现,主要解决方案是尽量使得所有下划线都跟裸字母连着,不要连着圆/花括号或者空格。
图片显示问题
将所有的 post
图片放到根目录下新建的 media
文件夹中,然后在引入图片的时候要用
这样来引入,不能有名字,要有 \media
开头。
如果想要图片对齐,以及对图片大小做操作可以用如下的方式:
<p align="center">
<img width="" height="" src="/img/media/15602214330109.jpg">
</p>
如果要加上 caption:
<p align="center">
<img src="/img/media/15547073032659.jpg" width="">
</p>
<p style="margin-top:-2.5%" align="center">
<em style="color:#808080;font-style:normal;font-size:80%;">卷积计算过程</em>
</p>
如何在 Github Pages 中加入 category 和 tags 功能
在阅读了这篇博客后简单试了下。
折叠一部分内容
<details><summary markdown="span">Click to show the Code</summary>
something to show with click
</details>
Click to show the Code
public init(title: String, level: MarkdownHeaderLevel = .h1, style: MarkdownHeaderStyle = .atx,
close: Bool = false)
算法伪代码的形式
虽然麻烦点,但是能实现,每一行都用 $$
。
**输入**:
* 训练集$D=\{(x_1,y_1),(x_2,y_2),... ,(x_n,y_n)\}$
* 属性集$A=\{a_1,a_2,...,a_n\}\\$
**过程**: 函数$TreeGenerate(D,A)$
**输出**: 以$node$为节点的一颗决策树
$1: 生成节点 node;$
$2: if$ $ D $ $ 中样本全属于同一类别$ $ C$ $ then$
$3: \quad将$ $ node $ $标 记为$ $ C$ $ 类叶节点;$ $ return$
$4: end$ $ if$
$5: if$ $ A=\emptyset $ $ OR$ $ D$ $ 中样本在A上取值相同$ $ then $
$6: \quad 将node标记为叶节点,其类别标记为D中样本数最多的类;then$
$7: end$ $if$
$8:从A中选择最优划分属性$
$9: for $ $ a_* $ $的每一个值$ $ a_{*}^{v}$ $ do$
$10:\quad 为node生成一个分支;令D_v表示D中在a_*上取值为a_{*}^{v} 的样本子集: $
$11:\quad if $ $D_v$ $为空$ $then$
$12: \quad\quad将分支节点标记为叶节点,其类别标记为D中样本最多的类;return$
$13: \quad else$
$14: \quad\quad以TreeGenerate(D_v,A$ $\{a_*\})为分支节点$
$15: \quad end$ $if$
$16: end$ $for$
输入:
- 训练集$D={(x_1,y_1),(x_2,y_2),… ,(x_n,y_n)}$
- 属性集$A={a_1,a_2,…,a_n}\$
过程: 函数$TreeGenerate(D,A)$ 输出: 以$node$为节点的一颗决策树
$1: 生成节点 node;$
$2: if$ $ D $ $ 中样本全属于同一类别$ $ C$ $ then$
$3: \quad将$ $ node $ $标 记为$ $ C$ $ 类叶节点;$ $ return$
$4: end$ $ if$
$5: if$ $ A=\emptyset $ $ OR$ $ D$ $ 中样本在A上取值相同$ $ then $
$6: \quad 将node标记为叶节点,其类别标记为D中样本数最多的类;then$
$7: end$ $if$
$8:从A中选择最优划分属性$
$9: for $ $ a_* $ $的每一个值$ $ a_{*}^{v}$ $ do$
$10:\quad 为node生成一个分支;令 D_v 表示 D 中在 a_* 上取值为 a_{*}^{v} 的样本子集: $
$11:\quad if $ $D_v$ $为空$ $then$
$12: \quad\quad将分支节点标记为叶节点,其类别标记为D中样本最多的类;return$
$13: \quad else$
$14: \quad\quad以TreeGenerate(D_v,A$ ${a_*})为分支节点$
$15: \quad end$ $if$
$16: end$ $for$
修改博文宽度
beautiful-jekyll 主题 中可以在 bootstrap.min.css 文件中修改 col-lg-9 宽度,改 col-lg-offset-1 即左侧空白距离,关联是在 layout 中的 post 配置。
博文排版的目的是为了方便阅读,如果中间有隔开的部分(公式)就不需要顶头空两格,尤其是在一行很短的情况下。
表格居中
<div align="center">
<div class="datatable-begin"></div>
Food | Description
------- | -----------
Apples | A small, somewhat round ...
Bananas | A long and curved, often-yellow ...
Kiwis | A small, hairy-skinned sweet ...
Oranges | A spherical, orange-colored sweet ...
<div class="datatable-end"></div>
</div>
Food | Description |
---|---|
Apples | A small, somewhat round … |
Bananas | A long and curved, often-yellow … |
Kiwis | A small, hairy-skinned sweet … |
Oranges | A spherical, orange-colored sweet … |
如果您觉得有用,可以考虑请我喝杯咖啡。☕️
![]() |
![]() |
---|---|
AliPay |