带有html背景和字体颜色问题的MathJax

当使用html背景和字体颜色时，以下html文件在显示模式下不显示LaTex表达式（分数a/b）。另外，在内联模式下，使用背景和字体颜色时，分母会将较低的边缘切割一点（如下图所示）。感谢您为我们提供MathJax，因为它在我们工作的许多领域对我们有很大的帮助。带有html背景和字体颜色问题的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：

来源

2017-08-06 nam

你可以通过改变<span style='color:white;background:black'>到<span class='inverted'>并添加这个CSS代码来解决它你样式表

.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可能真的很有帮助。

来源

2017-08-06 02:42:31 alex

您的建议工作（谢谢）。我在上面的Html文件中的''标签中添加了你的css代码，里面有''。 – nam

@nam还有其他方法可以做到这一点，并且可能会遇到许多CSS问题，为避免浪费时间，请考虑阅读教程。祝你好运。 – alex

带有html背景和字体颜色问题的MathJax

回答

相关问题