页面加载数学公式，mathjax转html

最新推荐文章于 2024-12-02 09:24:56 发布

凛冬深夜

最新推荐文章于 2024-12-02 09:24:56 发布

阅读量1k

点赞数

分类专栏： Java基础文章标签： latex js html 前端

本文链接：https://blog.youkuaiyun.com/qq_41967796/article/details/117820977

版权

本文介绍如何在web页面上加载和展示数学公式，提供了两个在线演示示例，利用MathJax将LaTeX语法转换为HTML，实现前端数学公式的动态渲染。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

web页面加载数学公式，mathjax转化为html

web页面加载数学公式

web页面加载数学公式

在线演示1 - 在线转换数学公式
 在线演示2 - 在线转换数学公式

<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  <meta name="viewport" content="width=device-width">
  <title>MathJax v3 with TeX input and HTML output</title>
  <link rel="dns-prefetch" href="//cdn.bootcss.com" />
  <style>
  /* MathJax v2.7.0 from 'cdn.bootcss.com' */
.MathJax {
   
  outline: 0;
}
.MathJax_Display {
   
  overflow-x: auto;
  overflow-y: hidden;
}
  /* MathJax v2.7.5 from 'cdnjs.cloudflare.com' */
.mjx-chtml {
   
  outline: 0;
}
.MJXc-display {
   
  overflow-x: auto;
  overflow-y: hidden;
}
  </style>
  
 
</head>
<body>
    <h1>MathJax v3 beta: TeX input, HTML output test</h1>
 
<p>解：</p> 
<p>1.025$\stackrel{
   （扩大到原数的100倍）}{
   →}$102.5</p> 
<p>50$\stackrel{
   （缩小到原数的\frac{
   1}{
   1000}）}{
   →}$0.05</p> 
<p>3.42$\stackrel{
   （扩大到原数的1000倍）}{
   →}$3420</p>

<br>

<p>答案：（1）&times;；（2）&times;；（3）√。</p > 
<p>解：</p > 
<p>（1）$\left\{
    \begin{
   array}{
   l}{
   3.24+3.06-1.29} \\ {
   3.24+(3.06-1.29)} \end{
   array} \right.$（&times;）</p > 
<p>（2）$\left\{
    \begin{
   array}{
   l}{
   5.14-(0.07+3)} \\ {
   5.14-0.07+3} \end{
   array} \right.$（&times;）</p > 
<p>（3）$\left\{
    \begin{
   array}{
   l}{
   5-0.07+3.42} \\ {
   5+0.07-3.42} \end{
   array} \right.$（√）

最低0.47元/天解锁文章