如何在 Dev.to 上编写优美的数学公式

Source: Dev.to

介绍

Dev.to 通过 KaTeX 支持数学公式。如果你在撰写关于算法、机器学习、密码学或任何数学密集型主题的文章，这是一项必备知识。本指南涵盖了从基本语法到实用技巧，帮助你让公式呈现得更出色。

独立方程

对于单独一行的方程，请将 LaTeX 代码包裹在 KaTeX liquid 标签中：

{% katex %}
\int_0^\infty e^{-x^2} \,dx = \frac{\sqrt{\pi}}{2}
{% endkatex %}

行内公式

对于文本中的公式，请使用 KaTeX 标签的行内变体：

The function {% katex inline %} f(x) = x^2 + 1 {% endkatex %} is defined for all real numbers.

分数

{% katex %}
\frac{a}{b}, \quad \dfrac{a}{b}, \quad \cfrac{1}{1+\cfrac{1}{2}}
{% endkatex %}

求和与乘积

{% katex %}
\sum_{k=1}^{n} k = \frac{n(n+1)}{2}, \quad \prod_{i=1}^{n} a_i
{% endkatex %}

积分

{% katex %}
\int_a^b f(x)\,dx,\quad \iint_D f(x,y)\,dx\,dy,\quad \oint_C \mathbf{F}\cdot d\mathbf{r}
{% endkatex %}

极限

{% katex %}
\lim_{n \to \infty} \left(1 + \frac{1}{n}\right)^n = e
{% endkatex %}

矩阵

{% katex %}
A = \begin{pmatrix}
a_{11} & a_{12} \\
a_{21} & a_{22}
\end{pmatrix}
{% endkatex %}

括号变体

• pmatrix – 圆括号
• bmatrix – 方括号
• vmatrix – 行列式竖线
• Bmatrix – 花括号

分段函数

{% katex %}
|x| = \begin{cases}
x & (x \geq 0) \\
-x & (x < 0)
\end{cases}
{% endkatex %}

多行对齐方程

使用 aligned 环境（而不是 align）在选定的位置对齐方程，通常是 =：

{% katex %}
\begin{aligned}
(a+b)^2 &= (a+b)(a+b) \\
        &= a^2 + 2ab + b^2
\end{aligned}
{% endkatex %}

常用希腊字母

常用运算符

样式与间距

调整前的间距

\int_0^1 f(x)dx

调整后的间距

\int_0^1 f(x)\,dx

自动调整大小的括号

使用 \left 和 \right 包裹高的内容，以自动调整分隔符的大小：

{% katex %}
\left(\frac{a}{b}\right)^2
{% endkatex %}

突出显示方程的部分

使用 \color{} 来强调组件：

{% katex %}
f(x) = \color{red}{a}x^2 + \color{blue}{b}x + \color{green}{c}
{% endkatex %}

框住的结果

使用 \boxed{} 来突出关键结果：

{% katex %}
\boxed{E = mc^2}
{% endkatex %}

什么在 Dev.to 的 KaTeX 中不起作用

• \newcommand – 不支持自定义宏
• \begin{align} – 在 KaTeX 标签内使用 aligned 替代
• \label / \ref – 没有自动编号或交叉引用
• 定理环境（\begin{theorem}）– 不可用
• TikZ 图形（tikzcd, tikzpicture）– 不会渲染
• $...$ 语法 – 必须使用 liquid 标签

手动公式编号

如果需要编号，请手动添加 \tag{}：

{% katex %}
E = mc^2 \tag{1}
{% endkatex %}

快速参考

• 块级数学: {% katex %} … {% endkatex %}
• 行内数学: {% katex inline %} … {% endkatex %}
• 多行公式: 在 KaTeX 标签中使用 aligned（而非 align）
• 间距: \,, \quad, \qquad
• 括号大小: \left … \right

这些技巧将帮助您在 Dev.to 上编写清晰、美观的数学内容。