MathJax: 在网页上显示 LaTeX 数学公式

最后更新日期：2019-09-21

修订历史

2019-09-21

迁移到 KaTeX
2011-05-02

初始版本

正文

　　在网页上显示数学公式，以前我知道的有这几种方法：

W3C 的 MathML -> 只有少数浏览器支持，不同浏览器显示不一致，而且最关键的是：太丑
mimetex -> 只能保存成图片，不能做成矢量图，制作 PDF 时效果较差

　　后来偶然在班固米上看到了 MathJax 这个神器：不但漂亮，而且使用 CSS 的 @font-face ，让出来的数学公式不是图片。我对班固米上的大神感到由衷地敬佩。。。

　　让我们先从那耳熟能详的求根公式开始：（可能速度比较慢，请耐心等待）

$x = \frac{-b\pm\sqrt{b^2-4ac}}{2a}$

　　然后，让我们看看高斯公式：

$\iiint_\Omega(\frac{\partial P}{\partial x}+\frac{\partial Q}{\partial y}+\frac{\partial R}{\partial z})dv=\oint_S Pdydz+Qdzdx+Rdxdy$

　　矩阵也是可以的：

$\left[\begin{array}{cccc}1&x_1&y_1&z_1\\1&x_2&y_2&z_2\\1&x_3&y_3&z_3\\1&x_4&y_4&z_4\end{array}\right]\left[\begin{array}{c}a_1\\a_2\\a_3\\a_4\end{array}\right]=\left[\begin{array}{c}T_1\\T_2\\T_3\\T_4\end{array}\right]$

　　下面是 LaTeX 公式常用符号 cheatsheet ：

1. 希腊字母

LaTeX	显示效果
`\alpha`	$\alpha$
`\beta`	$\beta$
`\gamma`	$\gamma$
`\delta`	$\delta$
`\omega`	$\omega$
`\rho`	$\rho$
`\tau`	$\tau$
`\lambda`	$\lambda$

2. 花体字

LaTeX	显示效果
`\mathcal{L}`	$\mathcal{L}$
`\mathcal{M}`	$\mathcal{M}$
`\mathbb{P}`	$\mathbb{P}$
`\mathbb{R}`	$\mathbb{R}$

3. 微积分

LaTeX	显示效果
`\int`	$\int$
`\iint`	$\iint$
`\iiint`	$\iiint$
`\oint`	$\oint$
`\oiint`	$\oiint$
`\partial`	$\partial$
`\infty`	$\infty$
`\prime`	$\prime$
`\dot x`	$\dot x$
`\ddot x`	$\ddot x$
`\lim`	$\lim$
`\log`	$\log$

4. 代数

LaTeX	显示效果
`\frac12`	$\frac12$
`\pm`	$\pm$
`\sum`	$\sum$
`\prod`	$\prod$
`\times`	$\times$
`\neq`	$\neq$
`\geq`	$\geq$
`\leq`	$\leq$
`\geqslant`	$\geqslant$
`\leqslant`	$\leqslant$
`\in`	$\in$
`\notin`	$\notin$
`\subseteq`	$\subseteq$
`\subset`	$\subset$
`\cup`	$\cup$
`\cap`	$\cap$
`\sqrt2`	$\sqrt2$
`\tilde x`	$\tilde x$
`\vec x`	$\vec x$
`\binom{3}{1}`	$\binom{3}{1}$

LaTeX	显示效果
`\left[ \begin{array}{cc} a11 & a12 \\ a21 & a22 \end{array} \right]`	$\left[\begin{array}{cc}a11&a12\\a21&a22\end{array}\right]$

5. 杂项

LaTeX	显示效果
`\`	$\$ 空格
`\dots`	$\dots$
`\rightarrow`	$\rightarrow$
`\leftarrow`	$\leftarrow$

LaTeX	显示效果
`\begin{aligned} (a+b)^2 &= (a+b)(a+b) \\ &= a^2+2ab+b^2 \end{aligned}`	$\begin{aligned} (a+b)^2 &= (a+b)(a+b) \\ &= a^2+2ab+b^2 \end{aligned}$ align 模式，按 & 的位置上下对齐

2019-09-21 更新

　　现在我的博客已经全面采用 KaTeX 来渲染数学公式，它比 MathJax 更快，而且设计之初就考虑了服务端渲染。虽然最新的 MathJax 3.0 支持了服务端渲染，但浏览器只支持到 IE 11 又让我只能放弃。所以本页面上你看到的都是 KaTeX 的渲染结果。

评论模式评论帮助

请按照如下格式发邮件：
收件人blog@henix.info
标题[复制]
正文评论 / 回复内容，只支持纯文本
说明评论用户名为你在邮箱中设置的用户名