MathJax 有 html 背景和字体颜色问题
MathJax with html background and font color issue
以下 html 文件在使用 html 背景和字体颜色时不会在显示模式下显示 LaTex
表达式(分数 a/b)。此外,在内联模式下,分母使用背景和字体颜色将下边缘切掉很多(如下图所示)。感谢您为我们提供 MathJax,因为它在我们工作的许多领域都对我们有很大帮助。
Html 文件
<html>
<head>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_HTMLorMML">
</script>
</head>
<body>
A \(\frac{a}{b}\) fraction in inline mode
<br/>
A\[\frac{a}{b}\] fraction in display mode
<br/>
A <span style='color:white;background:black'>\(\frac{a}{b}\)</span> fraction in inline mode with black background and white font
<br/>
A <span style='color:white;background:black'>\[\frac{a}{b}\]</span> fraction in display mode with black background and white font. This one is not displaying fraction.
</body>
</html>
同时显示在 IE 11 和 Chrome:
您可以通过将 <span style='color:white;background:black'>
更改为 <span class='inverted'>
并将此 CSS 代码添加到您的样式中来解决此问题 sheet
.inverted .math {
color: white;
background-color: black;
}
您可能还会发现 CSS Style Objects 有用。
编辑:
添加此 CSS 的一种方法是像这样更改 <head>
标签内的代码:
<head>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_HTMLorMML"></script>
<style type="text/css">
.inverted .math {
color: white;
background-color: black;
}
</style>
</head>
我也强烈建议您学习 CSS 的基础知识(至少),w3schools tutorials 可能真的很有帮助。
以下 html 文件在使用 html 背景和字体颜色时不会在显示模式下显示 LaTex
表达式(分数 a/b)。此外,在内联模式下,分母使用背景和字体颜色将下边缘切掉很多(如下图所示)。感谢您为我们提供 MathJax,因为它在我们工作的许多领域都对我们有很大帮助。
Html 文件
<html>
<head>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_HTMLorMML">
</script>
</head>
<body>
A \(\frac{a}{b}\) fraction in inline mode
<br/>
A\[\frac{a}{b}\] fraction in display mode
<br/>
A <span style='color:white;background:black'>\(\frac{a}{b}\)</span> fraction in inline mode with black background and white font
<br/>
A <span style='color:white;background:black'>\[\frac{a}{b}\]</span> fraction in display mode with black background and white font. This one is not displaying fraction.
</body>
</html>
同时显示在 IE 11 和 Chrome:
您可以通过将 <span style='color:white;background:black'>
更改为 <span class='inverted'>
并将此 CSS 代码添加到您的样式中来解决此问题 sheet
.inverted .math {
color: white;
background-color: black;
}
您可能还会发现 CSS Style Objects 有用。
编辑:
添加此 CSS 的一种方法是像这样更改 <head>
标签内的代码:
<head>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_HTMLorMML"></script>
<style type="text/css">
.inverted .math {
color: white;
background-color: black;
}
</style>
</head>
我也强烈建议您学习 CSS 的基础知识(至少),w3schools tutorials 可能真的很有帮助。