css - 为 MathJax 设置 CSS 样式、颜色

Question

您好，我正在尝试向我的 MathJax 输出添加样式。特别是我想为我的方程式设置一个全局颜色(以便它与我页面其余部分的样式相匹配)。目前我有以下配置。

<script type="text/x-mathjax-config">
    MathJax.Hub.Config({
      jax: ["input/TeX", "output/HTML-CSS"],
      tex2jax: {
        inlineMath: [ ['$', '$'] ],
        displayMath: [ ['$$', '$$']],
        processEscapes: true,
        skipTags: ['script', 'noscript', 'style', 'textarea', 'pre', 'code']
      },
      messageStyle: "none",
      "HTML-CSS": { 
          preferredFont: "TeX", 
          availableFonts: ["STIX","TeX"], 
          styles: {".MathJax" {color: "#CCCCCC";}} 
          }
    });
</script>
<script src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML" type="text/javascript"></script>

但是，如果我在我的配置中包含 styles 标记，我页面上的数学将完全拒绝显示。另一方面，如果我删除它，它显示正常。

编辑:我还应该注意，我曾尝试按照其他问题中的建议将样式直接添加到我的 CSS，但这导致了同样的结果，根本没有显示数学。

---

更新:我已经添加了 : 正如 Davide 在下面建议的那样，现在我的方程式显示了，但是样式信息被忽略了。样式似乎是从页面主体继承的，但将数学包装在具有不同样式的 div 中似乎也不会影响它。

更新 2: 我已经解决了 mathjax 忽略样式命令的问题。文本的颜色由我的 CSS * { colour: #292929 } 中的一行全局设置。这意味着来自 MathJax 的样式被忽略了。只需将 * 更改为 body、a、p、h1、h2 即可解决问题。

Answer 1

".MathJax" 后缺少冒号。你的代码应该是

<script type="text/x-mathjax-config">
MathJax.Hub.Config({
  jax: ["input/TeX", "output/HTML-CSS"],
  tex2jax: {
    inlineMath: [ ['$', '$'] ],
    displayMath: [ ['$$', '$$']],
    processEscapes: true,
    skipTags: ['script', 'noscript', 'style', 'textarea', 'pre', 'code']
  },
  messageStyle: "none",
  "HTML-CSS": { 
      preferredFont: "TeX", 
      availableFonts: ["STIX","TeX"], 
      styles: {".MathJax": {color: "#CCCCCC"}} 
      }
});
</script>

然后它应该适合你。