因为博文要用到数学公式,于是在网上搜索了如何让网页在浏览器中支持数学公式显示的方法,找到了一种方法,试验了一下,发现在小米浏览器下能显示,但在chrome下却网页加载缓慢且无法显示公式。
一开始还以为是markdown 解释器的缘故,在_config.yml中添加了一句
markdown: kramdown
添加后发现不仅数学公式显示不出来了,连新网页也不能生成了,猜想应该是markdown解释器没有生效。仔细检查后发现,markdown:之后, 要空一格 ,然后再输入kramdown。
修改后,页面能生成了,但数学公式仍没有。于是再在_layouts目录下,在default.html文件的
<head>...</head>
部分,添加上如下内容:
<script type="text/javascript"
src="//cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
经测试,在小米浏览器和chrome下都能快速加载页面并显示数学公式。经对照,网上的说法是
<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
但在我的博客设置上, 要将src中的http:这几个字符去掉,才能确保成功。
另外,网上也有说添加如下内容的,但我没测试:
<!-- mathjax config similar to math.stackexchange -->
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
tex2jax: {
inlineMath: [ ['$','$'], ["\\(","\\)"] ],
processEscapes: true
}
});
</script>
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
tex2jax: {
skipTags: ['script', 'noscript', 'style', 'textarea', 'pre', 'code']
}
});
</script>
<script type="text/x-mathjax-config">
MathJax.Hub.Queue(function() {
var all = MathJax.Hub.getAllJax(), i;
for(i=0; i < all.length; i += 1{
all[i].SourceElement().parentNode.className += ' has-jax';
}
});
</script>
<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
然后在发布的时候就可以使用$$来把需要显示的数学式子扩起来。像这样:
$$a^2 + b^2 = c^2$$
发布出来就是漂亮的公式了。
\[a^2 + b^2 = c^2\]还有一些更酷的例子,例如:
$$ J\alpha(x) = \sum\limits{m=0}^\infty \frac{(-1)^m}{m! \, \Gamma(m + \alpha + 1)}{\left({\frac{x}{2}}\right)}^{2 m + \alpha} $$
$$ \left( \sum_{k=1}^n a_k bk \right)^2 \leq \left( \sum{k=1}^n ak^2 \right) \left( \sum{k=1}^n b_k^2 \right)$$
好了,可以大显身手了;-)