使用本地CSS文件时,KaTeX的渲染结果很奇怪

时间:2019-02-08 14:11:30

标签: css katex

使用远程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} {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">​</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>

1 个答案:

答案 0 :(得分:2)

我们需要一个used by KaTeXfonts文件夹。
可以在this github repository中访问此文件夹。