使用远程css文件时,渲染效果很好,但使用本地css文件(我只是从cdn复制而从未更改字符)时,渲染结果会变得很奇怪。
Using local css file
Using remote css file
可以确定的是,本地css文件已加载,否则渲染结果将是这样的:
Inline equation: e=mc^2 e=mc2
Display equation:
\begin{Bmatrix} a & b \ c & d \end{Bmatrix} {acbd}
下面的源代码:
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/katex.min.css">
<!--local css file gone weird
<link rel="stylesheet" href="katex.min.css">
-->
</head>
<body>
<p>Inline equation: <span class="katex"><span class="katex-mathml"><math>
<semantics>
<mrow>
<mi>e</mi>
<mo>=</mo>
<mi>m</mi>
<msup>
<mi>c</mi>
<mn>2</mn>
</msup>
</mrow>
<annotation encoding="application/x-tex">e=mc^2</annotation>
</semantics>
</math></span><span class="katex-html" aria-hidden="true"><span class="base"><span class="strut" style="height:0.43056em;vertical-align:0em;"></span><span
class="mord mathdefault">e</span><span class="mspace" style="margin-right:0.2777777777777778em;"></span><span
class="mrel">=</span><span class="mspace" style="margin-right:0.2777777777777778em;"></span></span><span
class="base"><span class="strut" style="height:0.8141079999999999em;vertical-align:0em;"></span><span
class="mord mathdefault">m</span><span class="mord"><span class="mord mathdefault">c</span><span
class="msupsub"><span class="vlist-t"><span class="vlist-r"><span class="vlist" style="height:0.8141079999999999em;"><span
style="top:-3.063em;margin-right:0.05em;"><span class="pstrut" style="height:2.7em;"></span><span
class="sizing reset-size6 size3 mtight"><span class="mord mtight">2</span></span></span></span></span></span></span></span></span></span></span></p>
<p>Display equation:</p>
<p><span class="katex-display"><span class="katex"><span class="katex-mathml"><math>
<semantics>
<mrow>
<mo fence="true">{</mo>
<mtable>
<mtr>
<mtd>
<mstyle scriptlevel="0" displaystyle="false">
<mi>a</mi>
</mstyle>
</mtd>
<mtd>
<mstyle scriptlevel="0" displaystyle="false">
<mi>b</mi>
</mstyle>
</mtd>
</mtr>
<mtr>
<mtd>
<mstyle scriptlevel="0" displaystyle="false">
<mi>c</mi>
</mstyle>
</mtd>
<mtd>
<mstyle scriptlevel="0" displaystyle="false">
<mi>d</mi>
</mstyle>
</mtd>
</mtr>
</mtable>
<mo fence="true">}</mo>
</mrow>
<annotation encoding="application/x-tex">\begin{Bmatrix}
a & b \
c & d
\end{Bmatrix}</annotation>
</semantics>
</math></span><span class="katex-html" aria-hidden="true"><span class="base"><span class="strut" style="height:2.40003em;vertical-align:-0.95003em;"></span><span
class="minner"><span class="mopen delimcenter" style="top:0em;"><span class="delimsizing size3">{</span></span><span
class="mord"><span class="mtable"><span class="col-align-c"><span class="vlist-t vlist-t2"><span
class="vlist-r"><span class="vlist" style="height:1.45em;"><span style="top:-3.61em;"><span
class="pstrut" style="height:3em;"></span><span class="mord"><span class="mord mathdefault">a</span></span></span><span
style="top:-2.4099999999999997em;"><span class="pstrut" style="height:3em;"></span><span
class="mord"><span class="mord mathdefault">c</span></span></span></span><span
class="vlist-s"></span></span><span class="vlist-r"><span class="vlist" style="height:0.9500000000000004em;"><span></span></span></span></span></span><span
class="arraycolsep" style="width:0.5em;"></span><span class="arraycolsep" style="width:0.5em;"></span><span
class="col-align-c"><span class="vlist-t vlist-t2"><span class="vlist-r"><span class="vlist"
style="height:1.45em;"><span style="top:-3.61em;"><span class="pstrut" style="height:3em;"></span><span
class="mord"><span class="mord mathdefault">b</span></span></span><span
style="top:-2.4099999999999997em;"><span class="pstrut" style="height:3em;"></span><span
class="mord"><span class="mord mathdefault">d</span></span></span></span><span
class="vlist-s"></span></span><span class="vlist-r"><span class="vlist" style="height:0.9500000000000004em;"><span></span></span></span></span></span></span></span><span
class="mclose delimcenter" style="top:0em;"><span class="delimsizing size3">}</span></span></span></span></span></span></span></p>
</body>
</html>