MathML 渲染改进
MathML 是一个 W3C 推荐标准 和一个 ISO/IEC 标准,可用于在 HTML5 网页、EPUB3 电子书和许多其他基于 XML 的格式中编写数学内容。尽管 WebKit 长期以来一直支持它,但数学公式的渲染质量并未达到预期,并且缺少一些重要的 MathML 功能。然而,Igalia 最近为 WebKit 的 MathML 实现做出了贡献,并且 Safari 技术预览版 9 中已经包含了重大改进。我们将概述这些最近的更改以及最新 Safari 技术预览版渲染的精美数学公式的屏幕截图。还提供了截取屏幕截图的 MathML 演示,诚挚邀请您亲自尝试。
数学字体
我们继续依靠开放字体格式功能来提高数学渲染的质量。默认的用户代理样式表会尝试查找已知的数学字体,但您始终可以在font-family
on the <math>
元素上设置以选择您喜欢的字体。在下面的屏幕截图中,第一个公式使用Latin Modern Math渲染,而第二个公式使用Libertinus Math渲染。最后一个公式使用STIX 字体的过时版本渲染,该版本缺少许多开放字体格式功能。例如,可以看到积分和求和符号太小或它们的下标位置不正确。STIX 2 计划于 2016 年第三季度发布,有望修复许多问题,从而可用于 WebKit 的 MathML 渲染。

超链接
WebKit 现在支持 href 属性,该属性可用于在公式的任何部分设置超链接。这对于提供参考(例如符号或定理)很有用,如下面的示例所示。

数学变体
Unicode 包含数学字母数字符号以传达特殊含义。WebKit 现在使用此 Unicode 块中的斜体字符作为数学变量,并且mathvariant属性也可以用于轻松访问这些特殊字符。在下面的示例中,您可以看到斜体、Fraktur 字体、空心粗体和手写体变量。

运算符
对处理可拉伸运算符、大型符号和根式的代码进行了重大重构。因此,渲染质量现在大大提高,并且许多奇怪的错误已得到修复。

显示样式
数学公式可以集成到文本段落中(在 TeX 术语中称为行内公式),也可以显示在自己的水平居中段落中(在 TeX 术语中称为行间公式)。在后一种情况下,公式处于 displaystyle
模式,并且对垂直间距没有任何限制。在前一种情况下,数学公式的布局会稍作修改,以最大程度地减少垂直间距并更好地融入周围的文本。displaystyle
属性也可以使用相应的属性进行设置,或者在子公式中(例如在分数或下标中)自动更改。下面的屏幕截图显示了根据方程式是否为显示样式而产生的布局差异。请注意,displaystyle
属性也应影响字体大小,但WebKit 尚不支持 scriptlevel。

OpenType MATH 参数
许多新的OpenType MATH 功能已根据HTML5 中的 MathML 实现说明进行实现
- 使用
AxisHeight
参数设置分数、表格和对称运算符的垂直位置。 - 使用根式、下标和分数的布局常量以改进数学间距和定位。
- 使用大型运算符字形的斜体修正来设置下标的位置。
下面的屏幕截图说明了其中一些改进。对于第一个,使用 AxisHeight 可以更好地对齐分数线与加号、减号和等号。对于第二个,使用下标的布局常量以及曲面积分的斜体修正改进了其下标的放置。

阿拉伯数学
WebKit 已经支持用于编写阿拉伯数学符号的从右到左的数学布局。尽管字形级镜像尚不支持,但我们添加了对从右到左根式的支持。这允许使用基本的算术符号,如随后的图像所示。

结论
WebKit 的 MathML 支持最近发生了巨大变化,Igalia 的网络平台团队很高兴能在基于 WebKit 的浏览器和电子阅读器中看到精美的数学公式!如果您有任何意见、问题或反馈,可以通过 fwang@igalia.com 联系 Frédéric,或通过 @regocas 联系 Manuel。也欢迎向 WebKit 的缺陷跟踪器提交详细的缺陷报告。我们仍在完善该实现,敬请期待更多精彩新闻!