1

使用远程 css 文件时,渲染结果非常好,但是当使用本地 css 文件(我只是从 cdn 复制并且从未更改过字符)时,渲染结果变得很奇怪。

使用本地 css 文件
使用远程 css 文件

可以确定的是本地的css文件已经加载完毕,否则渲染结果会是这样的:

Inline equation: e=mc^2 e=mc2

Display equation:

\begin{Bmatrix} a & b \ c & d \end{Bmatrix} {ac​bd​}

源代码如下:

<!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 &amp; b \
                        c &amp; 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">​&lt;/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">​&lt;/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>
4

1 回答 1

2

我们需要的是一个KaTeX 使用fonts的文件夹。 可以在此 github 存储库中访问此文件夹。

于 2019-02-08T16:16:07.827 回答