0%

今天在写一篇博客的时候,遇到使用MathJax公式下标出现问题,然后在网上找到解决办法

出现问题的原因

hexo默认使用hexo-renderer-marked引擎去渲染网页,它会把利用Markdown语法写的文本去转换为相应的html标签。在利用Markdown写MathJax公式的时候,经常会用到下划线_表示下标,但是下划线_会被hexo的默认引擎hexo-renderer-marked渲染成html中的<em>标签,表示斜体,这样一来,我们写的MathJax公式就被错误渲染了,也就没办法正确显示出来。

解决方法

从上面的分析,我们可以知道问题或许出在hexo的渲染引擎上,如果渲染引擎不把公式中的一些特殊字符渲染成html标签,也就避免了这个问题。当然已经有人意识到了这个问题,并且对原先的渲染引擎进行了改进,生成了新的hexo-renderer-kramed引擎,这里是它的Github页面,所以我们只需要卸载默认引擎,并安装这个新的渲染引擎即可。

1
2
npm uninstall hexo-renderer-marked --save
npm install hexo-renderer-kramed --save

当我把渲染引擎更换之后,发现大部分公式都正确渲染了,而从网上其他人的叙述中,也同样提到了这个问题,即是行间公式都没有问题,但是个别行内公式还会出现渲染出错,从网上找到了一个方法,解决了这一问题。
定位到你的博客根目录,找到../node_modules/kramed/lib/rules/inline.js文件,
进行部分修改:

1
2
3
4
//escape: /^\\([\\`*{}\[\]()#$+\-.!_>])/,      第11行,将其修改为
escape: /^\\([`*\[\]()#$+\-.!_>])/,
//em: /^\b_((?:__|[\s\S])+?)_\b|^\*((?:\*\*|[\s\S])+?)\*(?!\*)/, 第20行,将其修改为
em: /^\*((?:\*\*|[\s\S])+?)\*(?!\*)/,

它取消了该渲染引擎对 \,{,} 的转义,然后再
1
2
hexo clean
hexo g

重新部署,即可解决问题。

另外需要注意一点,对于需要用到MathJax公式的文章,要在Front-matter中打开MathJax开关,例如:

1
2
3
4
5
6
---
date: 2017/8/3 18:20:00
tags: hexo
mathjax: true
title: hexo博客MathJax公式渲染
---

MathJax公式语法

LaTeX语法
下面呢,我整理总结了一番比较常用的MathJax公式语法,同时也可以用来测试一下渲染效果。

>添加公式的方法

1.行内公式

$行内公式$

2.行间公式

$$行间公式$$

>常用的MathJax公式语法

符号 释义 测试用例 最终效果
^{} 上标 x^{y^z}=(1+e^x)^{-2xy^w} $x^{y^z}=(1+e^x)^{-2xy^w}$
_{} 下标 CO_2 $CO_2$
\frac{分子}{分母} or 分子 \over 分母 分数 f(x,y,z)=3y^2z(3+\frac{7x+5}{1+y^2}) $f(x,y,z)=3y^2z(3+\frac{7x+5}{1+y^2})$
\sqrt[根指数,省略时为2]{被开方数} 开方 \sqrt{2}、\sqrt[3]{9} $\sqrt{2}$ $\sqrt[3]{9}$
\ldots 与文本底线对齐的省略号 x_1x_2{\ldots}x_n $x_1x_2{\ldots}x_n$
\cdots 与文本中线对齐的省略号 x_1x_2{\cdots}x_n $x_1x_2{\cdots}x_n$
\int_积分下限^积分上限(被积表达式) 积分 \int_1^n{x^2}dx $\int_1^n{x^2}dx$
\sum_{下标表达式}^{上标表达式} {累加表达式} 累加 \sum_{i=1}^n \frac{1}{i^2} $\sum_{i=1}^n \frac{1}{i^2}$
\, or ; or \quad or \qquad 不同宽度的空格 a , b \mid a ; b \mid a \quad b \mid a $\qquad b a,b∣a;b∣ab∣aba,b∣a;b∣ab∣ab$
\color{颜色}{文字} 更改文字颜色 \color{red}{红色} $\color{red}{红色}$

上面的一些基本语法使用了行内公式, 渲染效果没有问题,下面再利用行间公式写一些较为复杂的公式。

分段函数

分段函数格式为

1
f(x)=\begin{cases}语句1\\语句2\\...\end{cases}

\text{文字}中仍可以使用$公式$去插入其他公式,所以可以将其结合分段函数一起使用。

实例:
md文本

1
2
3
4
5
6
 $$ 
f(n)=\begin{cases}
n/2, & \text{如果$ x<=2 $}\\
3n+1, & \text{如果$ x>2 $}
\end{cases}
$$

最终效果:

大括号和小括号

()、[]、{}表示的即是符号本身,使用{}来表示{}。但是如果要显示大号的括号时,需要使用\left和\right命令。

实例:

正常括号
md文本

1
2
3
 $$
f([\frac{1+\{x,y\}}{(\frac{x}{y}+\frac{y}{x})(u+1)}+a]^{3\2})
$$

最终效果

大括号
md文本

1
2
3
4
5
6
7
8
9
10
11
12
13
14
    $$
f\left(
\left[
\frac{
1+\left\{x,y\right\}
}{
\left(
\frac{x}{y}+\frac{y}{x}
\right)
\left(u+1\right)
}+a
\right]^{3\2}
\right)
$$

最终效果

添加删除线

使用删除线功能必须使用行间公式,删除线分为片段删除线和整段删除线,样式比较多,在这里我只列举一种比较常用的水平删除线,它属于整段删除线的一种。

整段删除线使用\require{enclose}来显示,声明整段删除线后,使用\enclose{删除线效果}{字符}来实现删除线效果,而水平删除线效果用关键字horizontalstrike。

实例:

md文本

1
2
3
4
5
6
$$
\require{enclose}\begin{array}{}
\enclose{horizontalstrike}{x+y}\\
\enclose{horizontalstrike}{x*y}\\
\end{array}
$$

最终效果

对齐

\begin{align}用于开头,\end{align}用于结尾,对齐的位置用&开始,用\\结束
输入:

1
2
3
4
5
6
$$
\begin{align}
f(x) &=a+b+a\\
& = 2a+b
\end{align}
$$

输出:

减法器有两种:一种是先对输入信号实现反相,然后再做加法运算;另一种是直接利用差分电路实现

1.输入信号实现反相实现减法器

543cf225x7ca35edcb97b&690.jpg

2.差分电路实现减法器

543cf225x72dd2aab7ff5&690.jpg
我使用差分减法器比较多,主要用于电流、电压的测量
其计算输出电压的公式如下:

若令R1=R2,R3=R4,上式可简化为:

当你使用3.3V的单片机的时候,电平转换就在所难免了,经常会遇到3.3转5V或者5V转3.3V的情况,这里介绍一个简单的电路,他可以实现两个电平的相互转换(注意是相互哦,双向的,不是单向的!).电路十分简单,仅由3个电阻加一个MOS管构成。

  电路图如下:
1

上图中,S1,S2为两个信号端,VCC_S1和VCC_S2为这两个信号的高电平电压.另外限制条件为:
  1,VCC_S1<=VCC_S2.
  2,S1的低电平门限大于0.7V左右(视NMOS内的二极管压降而定).
  3,Vgs<=VCC_S1.
  4,Vds<=VCC_S2
  对于3.3V和5V/12V等电路的相互转换,NMOS管选择AP2306即可.原理比较简单,大家自行分析吧!此电路我已在多处应用,效果很好.

2

I2C
  类似这种吧,只是不知道这种电路的速率能达到多少
  电平转换器的操作
  在电平转换器的操作中要考虑下面的三种状态:
  1. 没有器件下拉总线线路。“低电压”部分的总线线路通过上拉电阻Rp 上拉至3.3V。 MOS-FET 管的门极和源极都是3.3V, 所以它的VGS 低于阀值电压,MOS-FET 管不导通。这就允许“高电压”部分的总线线路通过它的上拉电阻Rp 拉到5V。 此时两部分的总线线路都是高电平,只是电压电平不同。
  2. 一个3.3V器件下拉总线线路到低电平。MOS-FET管的源极也变成低电平,而门极是3.3V。VGS上升高于阀值,MOS-FET管开始导通。然后“高电压”部分的总线线路通过导通的MOS-FET管被3.3V器件下拉到低电平。此时,两部分的总线线路都是低电平,而且电压电平相同。
  3. 一个5V的器件下拉总线线路到低电平。MOS-FET管的漏极基底二极管“低电压”部分被下拉直到VGS超过阀值,MOS-FET管开始导通。“低电压”部分的总线线路通过导通的MOS-FET管被5V的器件进一步下拉到低电平。此时,两部分的总线线路都是低电平,而且电压电平相同。
  这三种状态显示了逻辑电平在总线系统的两个方向上传输,与驱动的部分无关。状态1执行了电平转换功能。状态2和3按照I2C总线规范的要求在两部分的总线线路之间实现“线与”的功能。
  除了3.3V VDD1和5V VDD2的电源电压外,还可以是例如:2V VDD1和10V VDD2。在正常操作中,VDD2必须等于或高于VDD1(在开关电源时允许VDD2低于VDD1)。
  MOS-N场效应管双向电平转换电路—适用于低频信号电平转换的简单应用
  
3

如上图所示,是MOS-N场效应管双向电平转换电路。
  双向传输原理:
  为了方便讲述,定义 3.3V 为 A 端,5.0V 为 B 端。
  A端输出低电平时(0V),MOS管导通,B端输出是低电平(0V)
  A端输出高电平时(3.3V),MOS管截至,B端输出是高电平(5V)
  A端输出高阻时(OC) ,MOS管截至,B端输出是高电平(5V)
  B端输出低电平时(0V),MOS管内的二极管导通,从而使MOS管导通,A端输出是低电平(0V)
  B端输出高电平时(5V),MOS管截至,A端输出是高电平(3.3V)
  B端输出高阻时(OC) ,MOS管截至,A端输出是高电平(3.3V)
  优点:
  1、适用于低频信号电平转换,价格低廉。
  2、导通后,压降比三极管小。
  3、正反向双向导通,相当于机械开关。
  4、电压型驱动,当然也需要一定的驱动电流,而且有的应用也许比三极管大。

1. 电阻桥定义解释

惠斯通电桥是由四个电阻组成的电桥电路,这四个电阻分别叫做电桥的桥臂,惠斯通电桥利用电阻的变化来测量物理量的变化,单片机采集可变电阻两端的电压然后处理,就可以计算出相应的物理量的变化,是一种精度很高的测量方式。其电路形式如下图所示。

110945pzcuhva3gm2cpncy

在电桥中有三个电阻阻值是固定的分别为R1,R2,R3,第四个电阻是可变的为Rx,Rx发生变化时,图中B,D两点之间的电压发生变化,通过采集电压的变化就可以知道环境中物理量的变化,而从实现测量的目的。下面举例介绍电桥电路的计算方式。

2. 电阻桥相关计算

假设流过R1,R2桥臂的电流为I1,流过R3,Rx桥臂的电流为I2,电桥供电电压为VCC,如下图所示。
fig1
通过欧姆定律可以计算出每个电阻两端的电压。在R1和R2这两个桥臂上,R1,R2将VCC电压分压,R2电阻两端得到的电压即为V1;在R3和Rx这个桥臂上,R3,Rx将VCC电压分压,R3电阻两端得到的电压即为V2。下面分别用欧姆定律计算V1和V2。

流过电阻R1和R2的电流I1:

R2两端的电压V1:

流过电阻R3和Rx的电流I2:

R3两端的电压:

V1和V2的电压差:

进一步计算得到:

由此可以看出:
如果4个电阻都相等,即R1=R2=R3=Rx,那么ΔV=0,即电桥处于平衡状态; Rx发生变化会导致△V发生变化;

3.电阻桥的应用

在实际使用中,我们通常将其中三个电阻值固定,而将另外一个电阻换成热敏电阻、压敏电阻、PT100等,这时候就可以用电桥来测物理量了。如果将PT100接入电桥,随着环境温度的变化,PT100的阻值发生变化导致ΔV发生变化,将差分电压ΔV通过差分运放放大后进入单片机的AD采样,再对照PT100的电阻-温度对应表就可以知道当前环境的温度了。

虚短和虚断的概念

由于运放的电压放大倍数很大,一般通用型运算放大器的开环电压放大倍数都在80 dB以上。而运放的输出电压是有限的,一般在 10 V~14 V。因此运放的差模输入电压不足1 mV,两输入端近似等电位,相当于 “短路”。开环电压放大倍数越大,两输入端的电位越接近相等。

“虚短”是指在分析运算放大器处于线性状态时,可把两输入端视为等电位,这一特性称为虚假短路,简称虚短。显然不能将两输入端真正短路。

由于运放的差模输入电阻很大,一般通用型运算放大器的输入电阻都在1MΩ以上。因此流入运放输入端的电流往往不足1uA,远小于输入端外电路的电流。故 通常可把运放的两输入端视为开路,且输入电阻越大,两输入端越接近开路。

“虚断”是指在分析运放处于线性状态时,可以把两输入端视为等效开路,这一特性 称为虚假开路,简称虚断。显然不能将两输入端真正断路。

在分析运放电路工作原理时,首先请各位暂时忘掉什么同向放大、反向放大,什么加法器、减法器,什么差动输入……暂时忘掉那些输入输出关系的公式……这些东东只会干扰你,让你更糊涂﹔也请各位暂时不要理会输入偏置电流、共模抑制比、失调电压等电路参数,这是设计者要考虑的事情。我们理解的就是理想放大器(其实在维修中和大多数设计过程中,把实际放大器当做理想放大器来分析也不会有问题)。

1.反向放大器

img

图一运放的同向端接地=0V,反向端和同向端虚短,所以也是0V,反向输入端输入电阻很高,虚断,几乎没有电流注入和流出,那么R1和R2相当于是串联的,流过一个串联电路中的每一只组件的电流是相同的,即流过R1的电流和流过R2的电流是相同的。
流过R1的电流

流过R2的电流

由虚短得

由虚断得

求解上面的初中代数方程得

这就是传说中的反向放大器的输入输出关系式了。

2.正向放大器

img
图二中Vi与V-虚短,则

因为虚断,反向输入端没有电流输入输出,通过R1和R2 的电流相等,设此电流为I,由欧姆定律得:

Vi等于R2上的分压, 即:

由上得

这就是传说中的同向放大器的公式了。

3.加法器

img
图三中,
由虚断及基尔霍夫定律知,通过R2与R1的电流之和等于通过R3的电流,故

由虚短知:

代入(2)式,(1)式变为

如果取$R1=R2=R3$,则上式变为

这就是传说中的加法器了。

img

由虚断知:运放同向端没有电流流过,则流过R1和R2的电流相等,同理流过R4和R3的电流也相等。故

由虚短知:
如果 ,则由以上式子可以推导出

也是一个加法器!

4.减法器

img
图五由虚断知,通过R1的电流等于通过R2的电流,同理通过R4的电流等于R3的电流,故有

如果$R1=R2$, 则

如果$R3=R4$, 则

由虚短知
所以

这就是传说中的减法器了。

5.积分电路

img
图六电路中
由虚短知,反向输入端的电压与同向端相等
由虚断知,通过R1的电流与通过C1的电流相等。
通过R1的电流

通过C1的电流

所以

输出电压与输入电压对时间的积分成正比,这就是传说中的积分电路了。
若V1为恒定电压U,则上式变换为

t 是时间,则Vout输出电压是一条从0至负电源电压按时间变化的直线。

6.微分电路

img
图七中
由虚断知,通过电容C1和电阻R2的电流是相等的
由虚短知,运放同向端与反向端电压是相等的。则:

这是一个微分电路。
如果V1是一个突然加入的直流电压,则输出Vout对应一个方向与V1相反的脉冲。

7.差分放大电路

img
图八.由虚短知

由虚断知,运放输入端没有电流流过,则R1、R2、R3可视为串联,通过每一个电阻的电流是相同的, 则电流

则:

由虚断知,流过R6与流过R7的电流相等,若$R6=R7$, 则

同理若$R4=R5$,则

由虚短知,

由(5)(7)(8)得

由(4)(9)得

上式中 $\frac{R1+R2+R3}{R2}$是定值,此值确定了差值$(V_y –V_x)$的放大倍数。

这个电路就是传说中的差分放大电路了。

8.电流采集电路

img
分析一个大家接触得较多的电路。很多控制器接受来自各种检测仪表的0~20mA或4~20mA电流,电路将此电流转换成电压后再送ADC转换成数字信号,图九就是这样一个典型电路。如图4~20mA电流流过采样100Ω电阻R1,在R1上会产生0.4~2V的电压差。
由虚断知,运放输入端没有电流流过,则流过R3和R5的电流相等,流过R2和R4的电流相等。故:

由虚短知:

电流从0~20mA变化,则

由(3)(4)式代入(2)式得

如果R3=R2,R4=R5,则由(5)-(1)得

图九中R4/R2=22k/10k=2.2,则f式Vout = -(0.88~4.4)V
即是说,将4~20mA电流转换成了-0.88 ~ -4.4V电压,此电压可以送ADC去处理。

9.恒流源电路

img
电流可以转换成电压,电压也可以转换成电流。图十就是这样一个电路。上图的负反馈没有通过电阻直接反馈,而是串联了三极管Q1的发射结,大家可不要以为是一个比较器就是了。只要是放大电路,虚短虚断的规律仍然是符合的!
由虚断知,运放输入端没有电流流过,

同理

由虚短知 $ V1 = V2 \cdot\cdot\cdot\cdot\cdot\cdot(3) $
如果 $ R2=R6,R4=R5 $,则由(1)(2)(3)式得

上式说明R7两端的电压和输入电压Vi相等,则通过R7的电流

如果负载RL<<100KΩ,则通过Rl和通过R7的电流基本相同。

10.三线制PT100前置放大电路

img
图十一是一个三线制PT100前置放大电路。
PT100传感器引出三根材质、线径、长度完全相同的线,接法如图所示。有2V的电压加在由R14、R20、R15、Z1、PT100及其线电阻组成的桥电路上。Z1、Z2、Z3、D11、D12、D83及各电容在电路中起滤波和保护作用,静态分析时可不予理会,Z1、Z2、Z3可视为短路,D11、D12、D83及各电容可视为开路。
由电阻分压知,

由虚短知,U8B第6、7脚 电压和第5脚电压相等*

由虚断知,U8A第2脚没有电流流过,则流过R18和R19上的电流相等。

由虚断知,U8A第3脚没有电流流过,

在桥电路中R15和Z1、PT100及线电阻串联,PT100与线电阻串联分得的电压通过电阻R17加至U8A的第3脚,

由虚短知,U8A第3脚和第2脚电压相等,*

由abcdef得, (V5-V7)/100=(V7-V3)/2.2 化简得

上式输出电压V5是Rx的函数我们再看线电阻的影响。Pt100最下端线电阻上产生的电压降经过中间的线电阻、Z2、R22,加至U8C的第10脚,
由虚断知,

由虚短知,

由式abc得

由式gh组成的方程组知,如果测出V5、V6的值,就可算出Rx及R0,知道Rx,查pt100分度表就知道温度的大小了。

1. Retext 的安装

在Ubuntu中只需要

1
sudo apt-get install retext

即可以安装该软件,其效果如下:
2018-01-07 20-31-25屏幕截图.png

2. Retext配置

2.1 添加数学公式

下载安装MathJax

1
sudo apt-get install libjs-mathjax

打开ReText的设置界面,在Markdown extensions框里添加字段:mathjax

编辑(Edit) –> 个人偏好(Preference),打开Preferences - Retext界面,输入mathjax

2018-01-07 20-42-30屏幕截图.png

重启ReText之后,输入公式,在预览中不显示。此时,通过 编辑(Edit) –> 使用WebKit渲染, 就可以完美解决问题。

示例:

1
$\frac{1}{2x+1}$或者$1\over{2x+1}$

效果:$\frac{1}{2x+1}$或者$1\over{2x+1}$

2.2 添加语法高亮

(1) 下载安装高亮支持模块python-pygments

1
sudo apt-get install python-pygments

(2) 打开ReText的设置界面,在Markdown extensions框里添加字段 codehilite
需要注意:

1、文档里的扩展功能添加进ReText的Markdown extensions时,都必须该成小写字母,否则无效!

2、两个扩展之间用英文逗号分割。

2.3 添加自定义CSS

reText支持添加自定义的css,比如,添加 github-markdown-css 方法如下:

打开 编辑 –>个人偏好(Preferences),打开PreferencesReText对话框。然后在Interface下面,点击Color scheme file,选择github-markdown-css.css,重新启动即可。

其中,github-markdown.css的内容如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
@font-face {
font-family: octicons-link;
src: url(data:font/woff;charset=utf-8;base64,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) format('woff');
}

.markdown-body {
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
line-height: 1.5;
color: #333;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-size: 16px;
line-height: 1.5;
word-wrap: break-word;
}

.markdown-body .pl-c {
color: #969896;
}

.markdown-body .pl-c1,
.markdown-body .pl-s .pl-v {
color: #0086b3;
}

.markdown-body .pl-e,
.markdown-body .pl-en {
color: #795da3;
}

.markdown-body .pl-smi,
.markdown-body .pl-s .pl-s1 {
color: #333;
}

.markdown-body .pl-ent {
color: #63a35c;
}

.markdown-body .pl-k {
color: #a71d5d;
}

.markdown-body .pl-s,
.markdown-body .pl-pds,
.markdown-body .pl-s .pl-pse .pl-s1,
.markdown-body .pl-sr,
.markdown-body .pl-sr .pl-cce,
.markdown-body .pl-sr .pl-sre,
.markdown-body .pl-sr .pl-sra {
color: #183691;
}

.markdown-body .pl-v {
color: #ed6a43;
}

.markdown-body .pl-id {
color: #b52a1d;
}

.markdown-body .pl-ii {
color: #f8f8f8;
background-color: #b52a1d;
}

.markdown-body .pl-sr .pl-cce {
font-weight: bold;
color: #63a35c;
}

.markdown-body .pl-ml {
color: #693a17;
}

.markdown-body .pl-mh,
.markdown-body .pl-mh .pl-en,
.markdown-body .pl-ms {
font-weight: bold;
color: #1d3e81;
}

.markdown-body .pl-mq {
color: #008080;
}

.markdown-body .pl-mi {
font-style: italic;
color: #333;
}

.markdown-body .pl-mb {
font-weight: bold;
color: #333;
}

.markdown-body .pl-md {
color: #bd2c00;
background-color: #ffecec;
}

.markdown-body .pl-mi1 {
color: #55a532;
background-color: #eaffea;
}

.markdown-body .pl-mdr {
font-weight: bold;
color: #795da3;
}

.markdown-body .pl-mo {
color: #1d3e81;
}

.markdown-body .octicon {
display: inline-block;
vertical-align: text-top;
fill: currentColor;
}

.markdown-body a {
background-color: transparent;
-webkit-text-decoration-skip: objects;
}

.markdown-body a:active,
.markdown-body a:hover {
outline-width: 0;
}

.markdown-body strong {
font-weight: inherit;
}

.markdown-body strong {
font-weight: bolder;
}

.markdown-body h1 {
font-size: 2em;
margin: 0.67em 0;
}

.markdown-body img {
border-style: none;
}

.markdown-body svg:not(:root) {
overflow: hidden;
}

.markdown-body code,
.markdown-body kbd,
.markdown-body pre {
font-family: monospace, monospace;
font-size: 1em;
}

.markdown-body hr {
box-sizing: content-box;
height: 0;
overflow: visible;
}

.markdown-body input {
font: inherit;
margin: 0;
}

.markdown-body input {
overflow: visible;
}

.markdown-body [type="checkbox"] {
box-sizing: border-box;
padding: 0;
}

.markdown-body * {
box-sizing: border-box;
}

.markdown-body input {
font-family: inherit;
font-size: inherit;
line-height: inherit;
}

.markdown-body a {
color: #4078c0;
text-decoration: none;
}

.markdown-body a:hover,
.markdown-body a:active {
text-decoration: underline;
}

.markdown-body strong {
font-weight: 600;
}

.markdown-body hr {
height: 0;
margin: 15px 0;
overflow: hidden;
background: transparent;
border: 0;
border-bottom: 1px solid #ddd;
}

.markdown-body hr::before {
display: table;
content: "";
}

.markdown-body hr::after {
display: table;
clear: both;
content: "";
}

.markdown-body table {
border-spacing: 0;
border-collapse: collapse;
}

.markdown-body td,
.markdown-body th {
padding: 0;
}

.markdown-body h1,
.markdown-body h2,
.markdown-body h3,
.markdown-body h4,
.markdown-body h5,
.markdown-body h6 {
margin-top: 0;
margin-bottom: 0;
}

.markdown-body h1 {
font-size: 32px;
font-weight: 600;
}

.markdown-body h2 {
font-size: 24px;
font-weight: 600;
}

.markdown-body h3 {
font-size: 20px;
font-weight: 600;
}

.markdown-body h4 {
font-size: 16px;
font-weight: 600;
}

.markdown-body h5 {
font-size: 14px;
font-weight: 600;
}

.markdown-body h6 {
font-size: 12px;
font-weight: 600;
}

.markdown-body p {
margin-top: 0;
margin-bottom: 10px;
}

.markdown-body blockquote {
margin: 0;
}

.markdown-body ul,
.markdown-body ol {
padding-left: 0;
margin-top: 0;
margin-bottom: 0;
}

.markdown-body ol ol,
.markdown-body ul ol {
list-style-type: lower-roman;
}

.markdown-body ul ul ol,
.markdown-body ul ol ol,
.markdown-body ol ul ol,
.markdown-body ol ol ol {
list-style-type: lower-alpha;
}

.markdown-body dd {
margin-left: 0;
}

.markdown-body code {
font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
font-size: 12px;
}

.markdown-body pre {
margin-top: 0;
margin-bottom: 0;
font: 12px Consolas, "Liberation Mono", Menlo, Courier, monospace;
}

.markdown-body .octicon {
vertical-align: text-bottom;
}

.markdown-body input {
-webkit-font-feature-settings: "liga" 0;
font-feature-settings: "liga" 0;
}

.markdown-body::before {
display: table;
content: "";
}

.markdown-body::after {
display: table;
clear: both;
content: "";
}

.markdown-body>*:first-child {
margin-top: 0 !important;
}

.markdown-body>*:last-child {
margin-bottom: 0 !important;
}

.markdown-body a:not([href]) {
color: inherit;
text-decoration: none;
}

.markdown-body .anchor {
float: left;
padding-right: 4px;
margin-left: -20px;
line-height: 1;
}

.markdown-body .anchor:focus {
outline: none;
}

.markdown-body p,
.markdown-body blockquote,
.markdown-body ul,
.markdown-body ol,
.markdown-body dl,
.markdown-body table,
.markdown-body pre {
margin-top: 0;
margin-bottom: 16px;
}

.markdown-body hr {
height: 0.25em;
padding: 0;
margin: 24px 0;
background-color: #e7e7e7;
border: 0;
}

.markdown-body blockquote {
padding: 0 1em;
color: #777;
border-left: 0.25em solid #ddd;
}

.markdown-body blockquote>:first-child {
margin-top: 0;
}

.markdown-body blockquote>:last-child {
margin-bottom: 0;
}

.markdown-body kbd {
display: inline-block;
padding: 3px 5px;
font-size: 11px;
line-height: 10px;
color: #555;
vertical-align: middle;
background-color: #fcfcfc;
border: solid 1px #ccc;
border-bottom-color: #bbb;
border-radius: 3px;
box-shadow: inset 0 -1px 0 #bbb;
}

.markdown-body h1,
.markdown-body h2,
.markdown-body h3,
.markdown-body h4,
.markdown-body h5,
.markdown-body h6 {
margin-top: 24px;
margin-bottom: 16px;
font-weight: 600;
line-height: 1.25;
}

.markdown-body h1 .octicon-link,
.markdown-body h2 .octicon-link,
.markdown-body h3 .octicon-link,
.markdown-body h4 .octicon-link,
.markdown-body h5 .octicon-link,
.markdown-body h6 .octicon-link {
color: #000;
vertical-align: middle;
visibility: hidden;
}

.markdown-body h1:hover .anchor,
.markdown-body h2:hover .anchor,
.markdown-body h3:hover .anchor,
.markdown-body h4:hover .anchor,
.markdown-body h5:hover .anchor,
.markdown-body h6:hover .anchor {
text-decoration: none;
}

.markdown-body h1:hover .anchor .octicon-link,
.markdown-body h2:hover .anchor .octicon-link,
.markdown-body h3:hover .anchor .octicon-link,
.markdown-body h4:hover .anchor .octicon-link,
.markdown-body h5:hover .anchor .octicon-link,
.markdown-body h6:hover .anchor .octicon-link {
visibility: visible;
}

.markdown-body h1 {
padding-bottom: 0.3em;
font-size: 2em;
border-bottom: 1px solid #eee;
}

.markdown-body h2 {
padding-bottom: 0.3em;
font-size: 1.5em;
border-bottom: 1px solid #eee;
}

.markdown-body h3 {
font-size: 1.25em;
}

.markdown-body h4 {
font-size: 1em;
}

.markdown-body h5 {
font-size: 0.875em;
}

.markdown-body h6 {
font-size: 0.85em;
color: #777;
}

.markdown-body ul,
.markdown-body ol {
padding-left: 2em;
}

.markdown-body ul ul,
.markdown-body ul ol,
.markdown-body ol ol,
.markdown-body ol ul {
margin-top: 0;
margin-bottom: 0;
}

.markdown-body li>p {
margin-top: 16px;
}

.markdown-body li+li {
margin-top: 0.25em;
}

.markdown-body dl {
padding: 0;
}

.markdown-body dl dt {
padding: 0;
margin-top: 16px;
font-size: 1em;
font-style: italic;
font-weight: bold;
}

.markdown-body dl dd {
padding: 0 16px;
margin-bottom: 16px;
}

.markdown-body table {
display: block;
width: 100%;
overflow: auto;
}

.markdown-body table th {
font-weight: bold;
}

.markdown-body table th,
.markdown-body table td {
padding: 6px 13px;
border: 1px solid #ddd;
}

.markdown-body table tr {
background-color: #fff;
border-top: 1px solid #ccc;
}

.markdown-body table tr:nth-child(2n) {
background-color: #f8f8f8;
}

.markdown-body img {
max-width: 100%;
box-sizing: content-box;
background-color: #fff;
}

.markdown-body code {
padding: 0;
padding-top: 0.2em;
padding-bottom: 0.2em;
margin: 0;
font-size: 85%;
background-color: rgba(0,0,0,0.04);
border-radius: 3px;
}

.markdown-body code::before,
.markdown-body code::after {
letter-spacing: -0.2em;
content: "\00a0";
}

.markdown-body pre {
word-wrap: normal;
}

.markdown-body pre>code {
padding: 0;
margin: 0;
font-size: 100%;
word-break: normal;
white-space: pre;
background: transparent;
border: 0;
}

.markdown-body .highlight {
margin-bottom: 16px;
}

.markdown-body .highlight pre {
margin-bottom: 0;
word-break: normal;
}

.markdown-body .highlight pre,
.markdown-body pre {
padding: 16px;
overflow: auto;
font-size: 85%;
line-height: 1.45;
background-color: #f7f7f7;
border-radius: 3px;
}

.markdown-body pre code {
display: inline;
max-width: auto;
padding: 0;
margin: 0;
overflow: visible;
line-height: inherit;
word-wrap: normal;
background-color: transparent;
border: 0;
}

.markdown-body pre code::before,
.markdown-body pre code::after {
content: normal;
}

.markdown-body .pl-0 {
padding-left: 0 !important;
}

.markdown-body .pl-1 {
padding-left: 3px !important;
}

.markdown-body .pl-2 {
padding-left: 6px !important;
}

.markdown-body .pl-3 {
padding-left: 12px !important;
}

.markdown-body .pl-4 {
padding-left: 24px !important;
}

.markdown-body .pl-5 {
padding-left: 36px !important;
}

.markdown-body .pl-6 {
padding-left: 48px !important;
}

.markdown-body .full-commit .btn-outline:not(:disabled):hover {
color: #4078c0;
border: 1px solid #4078c0;
}

.markdown-body kbd {
display: inline-block;
padding: 3px 5px;
font: 11px Consolas, "Liberation Mono", Menlo, Courier, monospace;
line-height: 10px;
color: #555;
vertical-align: middle;
background-color: #fcfcfc;
border: solid 1px #ccc;
border-bottom-color: #bbb;
border-radius: 3px;
box-shadow: inset 0 -1px 0 #bbb;
}

.markdown-body :checked+.radio-label {
position: relative;
z-index: 1;
border-color: #4078c0;
}

.markdown-body .task-list-item {
list-style-type: none;
}

.markdown-body .task-list-item+.task-list-item {
margin-top: 3px;
}

.markdown-body .task-list-item input {
margin: 0 0.2em 0.25em -1.6em;
vertical-align: middle;
}

.markdown-body hr {
border-bottom-color: #eee;
}

Hexo配置文件的设置

确保你的Hexo的配置文件_config.yml里面有个这个选项配置,并将其置为true

1
post_asset_folder: true

这个功能实际上是Hexo官方文档中提到的资源文件夹功能,它的作用在于当你使用

1
hexo new "hexo中完美插入本地图片"

生成一篇新文章时,会在 \source \_posts 目录下生成一个 hexo中完美插入本地图片(文章名).md 文件外,附带生成一个与 文章名 同名的文件夹,可以用它来存放这篇文章的所有资源,比如图片,附件等

安装hexo-asset-image插件

需要安装一个图片路径转换的插件, 进入博客 /根目录 使用如下命令安装插件

1
npm install https://github.com/CodeFalling/hexo-asset-image --save

插件安装完以后,会生成
1
\blog\node_modules\hexo-asset-image

插入图片

首先要把需要插入的图片放到“hexo中完美插入本地图片”这个资源文件夹下,然后进行路径引用,这是上面插入图片时的实际引用代码

1
![2018-01-07 16-39-28屏幕截图.png](2018-01-07 16-39-28屏幕截图.png)

实际效果
2018-01-07 16-39-28屏幕截图.png

首先将要删除的文章删除,然后把db.json删除掉 ,再执行

1
hexo clean

执行上述命令会请空public文件夹下所有文件
然后再
1
hexo g

重新生成