在移动设备上调整Mathjax的大小

Question

我的Mathjax代码在计算机上看起来很好但在移动设备上超大:http://teach.sg/mathematics/additional-mathematics/trigonometric-functions/

有什么方法可以自动调整移动设备的大小吗？

注意:我在iPhone 6上使用safari .Chrome给了我相同的结果.

Answer 1

我希望这个简单的解决方案适合您:

只需添加overflow-x: scroll;包含MathJax方程的div的样式.它将使您的MathJax方程式可滚动,并防止方程式超出范围.

在你的例子中,它是一个div id="std-body-box-2864" style="color:#000000; border-top-color: #56b5ff; border-left-color: #56b5ff; border-right-color: #56b5ff; border-bottom-color: #56b5ff; background-color: #ffffff;".

添加overflow-x: scroll;在风格标签的末尾:
style="color:#000000; border-top-color: #56b5ff; border-left-color: #56b5ff; border-right-color: #56b5ff; border-bottom-color: #56b5ff; background-color: #ffffff; overflow-x: scroll;".
它会在div的底部添加一个滚动条.MathJax方程将保留在"特殊角度"框中.
原始预览:

实际上可以有很多解决方案(包括使用jQuery的智能解决方案),您可以通过Google搜索"html中的响应表"来找到合适的解决方案.MathJax正在使用<span>,它实际上不是表格,但我希望这会有所帮助.