更改 mathjax 的字体大小答案

【问题标题】：Changing mathjax's font size更改 mathjax 的字体大小
【发布时间】：2013-10-05 20:09:43
【问题描述】：

我在我的页面上使用了 mathjax，并且我已经阅读过：

<script type="text/x-mathjax-config">
  MathJax.Hub.Config({
    "HTML-CSS": { scale: 175}
  });
</script>

应该让字体变大。但相反，它所做的只是使 mathjax 方程的容器更大，但字体保持不变。这是为什么？如何更改字体大小？

【问题讨论】：

您能否包含足够多的代码以供人们重现您的问题 - 即包含一段不会改变大小的文本的完整 html？
比例因子按我宣传的那样工作。根据 Floris 的要求，一个完整的示例会有所帮助。此外，您应该指出您正在使用的浏览器和操作系统，以及它们的版本，以防它是特定于浏览器的。此外，如果您使用 MathJax 上下文菜单来指定比例因子，它将覆盖页面中的比例因子。因此，您可能希望从浏览器中删除 MathJax cookie，然后再试一次。
有没有可能是之前版本的mathjax.js还在服务器上缓存？我已经对此进行了实验，有时我看到了变化，有时没有。

标签： mathjax

【解决方案1】：

当你在一个 div 中进行一些数学运算时：

<div id="some_math"> $$ x^2 $$</div>

你可以简单地使用这样的 CSS 来改变字体大小：

$("#some_math").css("font-size","150%");

【讨论】：

我正在使用 JQuery 的 getScript() 动态加载 MathJax。加载后设置 CSS 是唯一有效的方法。

【解决方案2】：

我尝试了很多东西，包括修改 config/default.js

http://docs.mathjax.org/en/latest/options/index.html

或 mathjax.js，它们都不起作用（我使用 Drupal 6，因此不得不恢复到 MathJax 1.1）

最后，根据 Wojciech 的回答，我找到了一些可行的方法。只需用这样的 div 将数学代码括起来：

<div style="font-size: 133%;">
<p>\begin{equation} \frac{\partial e_b}{\partial x^b} = &nbsp;&nbsp;\Gamma_{ab}^k &nbsp;e_k &nbsp; \end{equation}</p>
</div>

【讨论】：

【解决方案3】：

如果您需要全局调整大小，以下是我通过 CSS 实现的方法。

.MathJax {
font-size: 1.3em;
}

我使用了1.3 em，您可以更改它以更好地满足您的需求。

【讨论】：

您可能需要添加重要的：.MathJax { font-size: 1.3em !important; }
在没有重要标签的情况下为我工作，在其他情况下，覆盖结果可能真的很“重要”.. :D 感谢您指出..
@EchtEinfachTV：+1 - 没有!important 对我不起作用，所以感谢您指出这一点
@Jimbo 请注意，建议使用配置参数来缩放 mathjax，请参见此处：stackoverflow.com/a/25329062/1066234
为什么它对我不起作用？我在 Angular 中使用它。其他人有这个问题吗？

【解决方案4】：

如果您以这种方式加载 mathjax/latex，则可以全局更改公式的大小：

<script type="text/x-mathjax-config">
MathJax.Hub.Config({
  CommonHTML: {
    scale: 130
  }
});
</script>
<script type="text/javascript" async
src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-MML-AM_CHTML">
</script>

【讨论】：

未来注意事项：cdn.mathjax.org 即将结束生命周期，请查看mathjax.org/cdn-shutting-down 了解迁移提示。
这是根据documentation的正确方法。

【解决方案5】：

似乎<span> 标签适用于内联字体调整：

<span style="font-size:2.1em; line-height:0%">$a-b$</span>

应该很好地以 14px 字体大小为 Times 字体系列呈现“a-b”。

【讨论】：

对我来说效果很好（使分数看起来与其他数学相似）。虽然 1.3em 感觉好多了，除非你想要它很大。

【解决方案6】：

使用\tiny{ }、\scriptsize{ }、\small{ }、\normal{ }、\large{ }、\Large{ }、\LARGE{ }、\huge{ }、\Huge{ }。

【讨论】：

这会改变字体而不是仅仅缩放它

【解决方案7】：

这里有两个选项可以更改特定公式或公式的一部分的字体大小。

使用 .css 类。

\class{className}{}

className 是 div 类名，可以在 css 中指定。

使用乳胶

\tiny{ }, \scriptsize{ }, \small{ }, \normal{ }, \large{ }, \Large{ }, \LARGE{ }, \huge{ }, \Huge{ }

如果您想全局更改所有方程，MathJax 会在 div 内打印。使用 css 编辑类字体大小。

.MathJax {
    font-size: 12pt;
}

最后，如果您还可以编辑 MathJax 配置以全局更改字体，但我更喜欢 css 版本，因为它允许您更改不同屏幕尺寸的字体大小。

【讨论】：

【解决方案8】：

不要像其他人建议的那样使用 css，尤其是与换行符结合使用时。 Mathjax 计算它需要多少空间来换行，所以如果你之后改变它的大小，你会得到混乱的结果（溢出、坏断、剪裁等）

通过配置或 MML/Tex 实现

Styling MathJax

【讨论】：

【解决方案9】：

你应该把它添加到你的 CSS 中。

.MathJax_CHTML {
    font-size: 25px !important;
}

【讨论】：

【解决方案10】：

MathJax 3.0.0：

<script>
    MathJax = {
        tex: {
            inlineMath: [['$', '$'], ['\\(', '\\)']]
        },
        chtml: {
            scale: 1.3
        },
        svg: {
            scale: 1.3
        }
    };
</script>
<script src="/js/mathjax/tex-chtml.js" id="MathJax-script" async></script>

【讨论】：