MathML简介

Mathematical Markup Language (MathML) 是一个用于描述数学公式、符号的一种 XML标记语言。MDN上的资料：MathML | MDN，浏览器兼容性：Can I use: MathML，目前主流的现代浏览器都支持MathML，Chrome在109版本（2023年1月10日）感天动地正式支持了MathML（虽然是有点区别的MathML Core），与此同时Firefox和Safari早在八百年前就已经支持了MathML。

通常在浏览器中显示MathML公式需要额外的工具（例如MathJax），而浏览器原生支持MathML理论上就不再需要这些工具了。

MathML的字体问题

相关文档：Fonts for MathML – MathML | MDN。在Windows中默认使用的是Cambria Math字体，office中的公式也是默认使用的这个字体。对于安卓，由于没有自带的数学OpenType字体，实际调用系统默认的字体，显示相当拉跨。因此最好是网页能够内嵌字体。推荐使用的是 Latin Modern Math和STIX Two MathX字体，对<math>标签指定字体即可。

math {
    font-family: 'STIX Two Math';
}

MathML的换行问题

在Chrome中，如果容器太小不会导致<math>标签中的数学公式换行而是直接溢出，而且这个溢出也很离奇，它的宽度比公式的实际宽度小，因此使用<table>之类的时候会全部挤在一起，就像这个样子：

而在Firefox中就没有这个问题，Firefox会默认换行。

这个玩意也是很神奇，试了好几个css像overflow-wrap、word-break都不行，只有white-space才可以。

math {
    white-space: nowrap;
}

加了这个css之后公式就不会因为空间小换行了，更神奇的是chrome挤在一起的问题也解决了（汗）。