Question

在我的博客上，我想用红色显示问题，用蓝色用颜色显示答案。在问答中我使用MathJAx来渲染MathML。我控制着使用CSS的MathJax着色像这样

    h3, h2, h4, h5
    {
        text-align: left;
        font-weight: bold;
        font-family: Verdana;
    }
    .question
    {
        text-align: left;
        color: Red;

    }
    .centerit
    {
        color: Blue;
        text-align: center;
    }

在IE中完美运行但在FireFox中，它总是以黑色显示MathJax？任何解决此问题的方法。我正在使用MathJax 2。

Thankx

Answer 1

MathJax支持\color宏，但它与LaTeX的工作方式不同。在LaTeX中，\color的工作方式类似于普通的TeX命令，例如\bf，但MathJax将其视为像\textbf这样的LaTeX命令。

\[ \color{red} The whole sentence is red in LaTeX,
   but only the initial T is colored in MathJax.  \]

Answer 2

如果您使用file://网址在本地测试您的网站，那么Firefox的同源策略可能会强制MathJax使用图像字体而不是网络字体。请参阅此处的MathJax FAQ条目，特别是有关Firefox本地@font-face的部分。一种解决方案是在您正在进行测试的计算机上本地安装MathJax字体。可以从MathJax GitHub repository获取字体（单击字体，然后单击右上角的“原始”按钮）。

或者，您可以在调试过程中忽略黑色，因为一旦转移到实时网站，它就能正常工作。

Answer 3

如果要为方程式的不同部分上不同的颜色（例如，如果要对变量进行颜色编码），请使用\textcolor而不是\color命令，以避免出现间距问题。

查看区别：

使用\textcolor（首选）：

<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>

$$
y = \textcolor{red}{\sin} x
$$

使用\color（造成不正确的间距）：

<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>

$$
y = \color{red}{\sin} x
$$

彩色的MathJax方程可改善可读性演示：trigids.com。

MathJax中的颜色

3 个答案: