This article explains how to embed LaTeX-formatted mathematical expressions into HTML pages. When creating documents containing mathematical expressions, you can display beautiful formulas using MathJax.
Adding MathJax
First, add the MathJax script to the <head> section of your HTML. Here’s an example of a <head> section with the necessary script:
<head>
<meta charset="utf-8">
<script>window.MathJax = { MathML: { extensions: ["mml3.js", "content-mathml.js"]}};</script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
</head>
This code loads MathJax and prepares it to render LaTeX-formatted mathematical expressions.
Embedding LaTeX Formulas
Next, you can add the LaTeX formulas you want to embed to your HTML content. Here’s a simple example:
<p>Example of embedding a formula:</p>
\[E=mc^2\]
<p>Another example:</p>
\[
\int_0^{\infty} e^{-x^2} dx = \frac{\sqrt{\pi}}{2}
\]
In the above example, LaTeX-formatted formulas are enclosed in double dollar signs \[ ... \] to embed them. When MathJax is enabled, these formulas are automatically displayed beautifully.
Displaying Results
Save this HTML code in an editor and try opening it in a web browser such as Google Chrome. The formulas will be beautifully rendered by MathJax and displayed in a readable format.
Using this method, you can easily embed LaTeX formulas into web pages. When creating documents containing mathematical content, you can provide formulas in a format that’s easy for readers to understand.
MathJax official website: https://www.mathjax.org/