使用移动设备时，MathJax 方程不适合窗口的宽度-前端问题

MathJax equation does not fit the width of window when using mobile(使用移动设备时，MathJax 方程不适合窗口的宽度)

本文介绍了使用移动设备时，MathJax 方程不适合窗口的宽度的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

在我的博文(与 Hugo 编译)中，我有本节
在计算机屏幕上使用浏览器时，本节中的数学方程式可以很好地呈现，但是，当我在移动设备上查看时，方程式在中间被剪切，没有滚动选项.

In my blog post (compiled with Hugo) I have this section
The math equations in this section are presented well when using a browser on a computer screen, however, when I view this on mobile the equations are being cut in the middle with no scrolling option.

我想在移动设备上访问时仅调整这些方程式的大小以适应窗口，或者在需要时添加滚动选项.我怎样才能做到这一点?

I want to either resize only these equations to fit the window when accessed on mobile, or adding a scrolling option when it is needed. How can I achieve that?

我正在使用 Markdown 来写我的帖子.我已经尝试了很多东西，包括将此代码添加到我的降价文件中:

I am using Markdown to write my posts. I have tried a lot of things, including adding this code to my markdown file:

<script type="text/x-mathjax-config">
  MathJax.Hub.Config({
    "HTML-CSS": {linebreaks: { automatic: true }}
  })
</script>

但它不起作用.

推荐答案

有问题的方程式是表格环境，表格不能换行.

The problematic equations are tabular environments and tables cannot linebreak.

要获得滚动，您可以在页面中添加以下 CSS.

To gain scrolling, you can add the following CSS to your page.

.MathJax_Display, .MJXc-display, .MathJax_SVG_Display {
    overflow-x: auto;
    overflow-y: hidden;
}

顺便说一句，该页面使用的是古老版本的 MathJax -- cdn.mathjax.org 已于 3 年前有效关闭，不再获得更新.

By the way, the page is using an ancient version of MathJax -- cdn.mathjax.org was effectively shut down 3 years ago and no longer gets updates.

这篇关于使用移动设备时，MathJax 方程不适合窗口的宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！