如何使 MathJax 响应并自动添加换行符？

Question

我已经阅读了关于自动添加换行符的 MathJax 文档，但它似乎没有效果。

我不知道如何让 MathJax 响应。我的网站允许用户使用 LaTeX 编写数学公式。但是，在移动屏幕上，有时输出太宽，我需要想办法调整它的大小。

我不能要求我的用户只对短公式使用此功能。

错误输出示例：

我根据文档做了什么（但不起作用）：

MathJax.Hub.Config({
    tex2jax: {
         inlineMath: [['$','$'], ['\(','\)']]
    },
    "HTML-CSS": { 
         linebreaks: { automatic: true }
    },
    SVG: { 
         linebreaks: { automatic: true } 
    }
});

JS 的完整代码 Fiddle : https://jsfiddle.net/ao8cnquw/

Answer 1

这是当前此特定示例的预期行为。

MathJax 的换行现在在 MathML 标记元素中不起作用（并且这个 TeX 示例将在内部转换为单个多行文本元素）。计划对此提供支持，但文档对这两个事实都不太清楚。

您需要退出 \text 以获得休息（或者在其中包含 $...$ 以便 MathJax 退出）。[实际上，请参阅下面的第二次更新]

请注意，换行还有其他更普遍的限制，例如，任何类似 table 的环境只能在单元格内换行。

还有对真正响应式方程渲染的研究，请参阅https://github.com/mathjax/MathJax-RespEq

更新。我之前忘记的东西。您的示例也是内联数学，MathJax 仅在等式长于直线时才会中断。这个其实是提到了in the documentation。但是，正如我所写，因为它在内部只是一个令牌元素，所以这在您的示例中也不会发生。

另一个更新。实际上，还有一个特定于内容的问题。 MathML 换行算法只允许在 <mo> 或 <mspace> 元素处发生换行，而 MathJax 遵循这一点（因为，如前所述，它本质上是一个 MathML 渲染器）。因此，即使您的示例被修改为 \text{Avec 0$ €, puis-je acheter 2 billets à 0$ € et un troisième billet à $ % de réduction ?} 之类的内容，您仍然看不到换行符。所以对于这种内容，最好不要把所有东西都推到\text{}里面（反正这样最好，恕我直言）。

Answer 2

另一种使公式响应而不触及中断的方法是将以下样式应用于适当的容器。

.yourcontainer {
    white-space: normal;
}

不用说，如果您不太热衷于公式将被破坏的元素。

如何使 MathJax 响应并自动添加换行符？

How to make MathJax responsive and add line breaks automatically?

css

mathjax