在html中使用数学公式latex

简介: 在html中使用数学公式latex

1.

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.10/dist/katex.min.css" integrity="sha384-wcIxkf4k558AjM3Yz3BBFQUbk/zgIYC2R0QpeeYb+TwlBVMrlgLqwRjRtGZiK7ww" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.10/dist/katex.min.js" integrity="sha384-hIoBPJpTUs74ddyc4bFZSM1TVlQDA60VBbJS0oA934VSz82sBx1X7kSx2ATBDIyd" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.10/dist/contrib/auto-render.min.js" integrity="sha384-43gviWU0YVjaDtb/GhzOouOXtZMP/7XUzwPTstBeZFe/+rCMvRwr4yROQP43s0Xk" crossorigin="anonymous"></script>
<script>
    document.addEventListener("DOMContentLoaded", function() {
        renderMathInElement(document.body, {
          // customised options
          // • auto-render specific keys, e.g.:
          delimiters: [
              {left: '$$', right: '$$', display: true},
              {left: '$', right: '$', display: false},
              {left: '\\(', right: '\\)', display: false},
              {left: '\\[', right: '\\]', display: true}
          ],
          // • rendering keys, e.g.:
          throwOnError : false
        });
    });
</script>

来自 https://katex.org/docs/autorender 可以自动渲染

2.

在index.html 添加

<script>MathJax = {tex: {inlineMath: [['$', '$'],['$$', '$$'], ['\\(', '\\)']]}}</script>
<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js"></script>

在vue中添加

nextTick(() => MathJax.typesetPromise())


目录
相关文章
|
6月前
|
机器学习/深度学习 存储 资源调度
如何将html转换成markdown?
如何将html转换成markdown?
105 0
|
5天前
编程笔记 html5&css&js 007 HTML文本:段落和格式
编程笔记 html5&css&js 007 HTML文本:段落和格式
|
6月前
html+圣诞树
一个HTML的圣诞树
76 0
|
9月前
圣诞树Html编写
圣诞树Html编写
35 0
|
11月前
LaTex数学公式语法网站
LaTex数学公式语法网站
87 0
|
前端开发 JavaScript
HTML 转 Markdown 如此简单
本文推荐 HTML 转为 markdown 的工具和实现方式,并找到了一个快捷技巧,收藏等于学会。
1792 1
|
前端开发 JavaScript
使用HTML实现一个不一样的圣诞树
使用HTML实现一个不一样的圣诞树
使用HTML实现一个不一样的圣诞树
零基础HTML入门教程(10)——图像
我们这一小结学习了img图片标签,有了我们可以随意在网页设计插入图片,大家下面要熟练使用。我们上一小节学习了注释,我们这一小节学习一下图像,理解图像含义并熟练使用。但是图片一般是一个文件,我们可以通过源属性,将图片显示到img标签中。标签有两个必需的属性:src 属性 和 alt 属性。图片没法用文字描述,很难把图片放到img标签的内容部分。标签并不会在网页中插入图像,而是从网页上链接图像。标签创建的是被引用图像的占位空间。img 元素向网页中嵌入一幅图像。请注意,从技术上讲,