2023-04-10 15:38:20 +02:00
<!doctype html> < html lang = en > < head > < meta charset = utf-8 > < meta name = viewport content = "width=device-width,initial-scale=1" > < meta property = "og:title" content = "Math Typesetting" > < meta property = "og:description" content = "A brief guide to write mathematical notation." > < meta property = "og:type" content = "article" > < meta property = "og:url" content = "https://mivinci.github.io/hugo-theme-minima/math-typesetting/" > < meta property = "article:section" content > < meta property = "article:published_time" content = "2020-07-18T10:52:59+08:00" > < meta property = "article:modified_time" content = "2020-07-18T10:52:59+08:00" > < meta name = twitter:card content = "summary" > < meta name = twitter:title content = "Math Typesetting" > < meta name = twitter:description content = "A brief guide to write mathematical notation." > < meta name = theme-color media = "(prefers-color-scheme: light)" content = "#ffffff" > < meta name = theme-color media = "(prefers-color-scheme: dark)" content = "#262d33" > < title > Hugo on Minima - Math Typesetting< / title > < link rel = "shortcut icon" href = /hugo-theme-minima/favicon.ico type = image/x-icon > < link rel = stylesheet href = /hugo-theme-minima/minima.css > < script defer type = text/javascript src = /hugo-theme-minima/minima.js > < / script > < / head > < script > const default _theme _config = 'sand' , default _light _theme = default _theme _config === 'system' ? 'light' : default _theme _config ; let default _theme = window . matchMedia ( '(prefers-color-scheme: dark)' ) . matches ? 'dark' : default _light _theme ; try { const a = localStorage . getItem ( 'theme' ) ; a && ( default _theme = a === default _light _theme ? a : default _light _theme ) , localStorage . setItem ( 'theme' , default _theme ) , window . minima _theme = default _theme , document . querySelector ( 'html' ) . classList . add ( default _theme ) } catch ( a ) { console . error ( a ) } < / script > < body > < header class = "mt-3 mb-6" > < div class = "container mx-auto" > < nav class = "flex justify-between items-center" > < div class = "flex items-center" > < div id = theme-switch class = "text-3xl cursor-pointer" > 🌝< / div > < / div > < ul class = "flex items-center text-base font-bold
whitespace-nowrap overflow-x-auto overflow-y-hidden">< li class = "ml-2 mr-2" > < a href = /hugo-theme-minima/tags > Tags< / a > < / li > < li class = "ml-2 mr-2" > < a href = /hugo-theme-minima/series > Series< / a > < / li > < / ul > < ul class = "flex item-center text-sm font-bold" > < li class = ml-2 > < a href = https://mivinci.github.io/hugo-theme-minima/ > EN< / a > < / li > < li class = ml-2 > < a href = https://mivinci.github.io/hugo-theme-minima/zh-cn/ > 简中< / a > < / li > < / ul > < / nav > < / div > < / header > < div class = "container mx-auto" > < h1 class = "text-4xl font-extrabold mt-6 mb-6" > Math Typesetting< / h1 > < div class = "mb-3 text-sm flex justify-between" > < div > Post at — Jul 18, 2020< / div > < div > < a class = ml-1 href = /hugo-theme-minima/tags/KaTex > #KaTex< / a >
2023-03-15 17:22:56 +01:00
< a class = ml-1 href = /hugo-theme-minima/tags/markdown > #markdown< / a > < / div > < / div > < main class = mb-8 > < p > A brief guide to write mathematical notation.< / p > < article class = md > < p > Mathematical notation in a Hugo project can be enabled by using third party JavaScript libraries like < a href = https://katex.org > KaTeX< / a > the one that Minima uses. Here’ s what you can do in the configuration file to enable it.< / p > < pre > < code > math:
2022-11-10 09:00:54 +01:00
enable: false
provider: katex
< / code > < / pre > < h2 id = examples > Examples< / h2 > < p > The following are some examples of mathematical notations with KaTeX that are pretty much like LaTeX’ s.< / p > < h3 id = block > Block< / h3 > < pre > < code > \varphi = 1+\frac{1}{1+\frac{1}{1+\frac{1} {1+\cdots}}}
< / code > < / pre > < p > wiil be rendered as:< / p > < p > $$
\varphi = 1+\frac{1}{1+\frac{1}{1+\frac{1} {1+\cdots}}}
$$< / p > < h3 id = inline > Inline< / h3 > < pre > < code > Pythagorean theorem can be written as $a^2+b^2=c^2$ where *a*, *b* and *c* are the length of legs of a triangle.
2023-04-10 15:38:20 +02:00
< / code > < / pre > < p > will be rendered as:< / p > < p > Pythagorean theorem can be written as $a^2+b^2=c^2$ where < em > a< / em > , < em > b< / em > and < em > c< / em > are the length of legs of a triangle.< / p > < / article > < / main > < link rel = stylesheet href = https://cdn.jsdelivr.net/npm/katex@0.13.11/dist/katex.min.css integrity = sha384-Um5gpz1odJg5Z4HAmzPtgZKdTBHZdw8S29IecapCSB31ligYPhHQZMIlWLYQGVoc crossorigin = anonymous > < script defer src = https://cdn.jsdelivr.net/npm/katex@0.13.11/dist/katex.min.js integrity = sha384-YNHdsYkH6gMx9y3mRkmcJ2mFUjTd0qNQQvY9VYZgQd7DcN7env35GzlmFaZ23JGp crossorigin = anonymous > < / script > < script defer src = https://cdn.jsdelivr.net/npm/katex@0.13.11/dist/contrib/auto-render.min.js integrity = sha384-vZTG03m+2yp6N6BNi5iM4rW4oIwk5DfcNdFfxkk9ZWpDriOkXX8voJBFrAO7MpVl crossorigin = anonymous > < / script > < script > document . addEventListener ( "DOMContentLoaded" , function ( ) { renderMathInElement ( document . body , { delimiters : [ { left : '$$' , right : '$$' , display : ! 0 } , { left : '$' , right : '$' , display : ! 1 } , { left : '\\(' , right : '\\)' , display : ! 1 } , { left : '\\[' , right : '\\]' , display : ! 0 } ] , throwOnError : ! 1 } ) } ) < / script > < div id = comment > < / div > < script > const s = document . createElement ( "script" ) ; s . src = "https://giscus.app/client.js" , s . crossOrigin = "anonymous" , s . async = ! 0 , s . setAttribute ( "data-repo" , "mivinci/hugo-theme-minima" ) , s . setAttribute ( "data-repo-id" , "MDEwOlJlcG9zaXRvcnkzODcxMjM2NDU=" ) , s . setAttribute ( "data-category" , "Comments" ) , s . setAttribute ( "data-category-id" , "DIC_kwDOFxMJvc4CScQm" ) , s . setAttribute ( "data-mapping" , "pathname" ) , s . setAttribute ( "data-strict" , "0" ) , s . setAttribute ( "data-reactions-enabled" , "1" ) , s . setAttribute ( "data-emit-metadata" , "0" ) , s . setAttribute ( "data-input-position" , "buttom" ) , s . setAttribute ( "data-theme" , window . minima _theme + "_protanopia" ) , s . setAttribute ( "data-lang" , "en" ) , s . setAttribute ( "data-loading" , "lazy" ) , document . getElementById ( "comment" ) . appendChild ( s ) < / script > < / div > < footer class = "mt-8 mb-8" > < div class = "container mx-auto" > < div class = "mt-8 flex justify-between items-center" > < p class = "mt-0 text-sm" > © 2023 X |
2021-09-11 06:07:36 +02:00
< a href = https://gohugo.io target = _blank rel = "noopener noreferrer" > Hugo< / a > on
2023-05-03 11:32:48 +02:00
< a href = https://github.com/mivinci/hugo-theme-minima target = _blank rel = "noopener noreferrer" > Minima< / a > < / p > < p class = "flex items-center mt-0" > < a class = "icon ml-1 mr-1" href = https://twitter.com/realmivinci title = twitter > < svg xmlns = "http://www.w3.org/2000/svg" width = "18" height = "18" viewBox = "0 0 24 24" fill = "none" stroke = "currentcolor" stroke-width = "2" stroke-linecap = "round" stroke-linejoin = "round" > < path d = "M23 3a10.9 10.9.0 01-3.14 1.53 4.48 4.48.0 00-7.86 3v1A10.66 10.66.0 013 4s-4 9 5 13a11.64 11.64.0 01-7 2c9 5 20 0 20-11.5a4.5 4.5.0 00-.08-.83A7.72 7.72.0 0023 3z" / > < / svg > < / a > < a class = "icon ml-1 mr-1" href = mailto:mivinci@qq.com title = email > < svg xmlns = "http://www.w3.org/2000/svg" width = "18" height = "18" viewBox = "0 0 24 21" fill = "none" stroke = "currentcolor" stroke-width = "2" stroke-linecap = "round" stroke-linejoin = "round" > < path d = "M4 4h16c1.1.0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1.0-2-.9-2-2V6c0-1.1.9-2 2-2z" / > < path d = "M22 6l-10 7L2 6" / > < / svg > < / a > < a class = "icon ml-1 mr-1" href = https://github.com/mivinci/hugo-theme-minima title = github > < svg xmlns = "http://www.w3.org/2000/svg" width = "18" height = "18" viewBox = "0 0 24 24" fill = "none" stroke = "currentcolor" stroke-width = "2" stroke-linecap = "round" stroke-linejoin = "round" > stroke-linecap="round" stroke-linejoin="round">< path d = "M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37.0 00-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44.0 0020 4.77 5.07 5.07.0 0019.91 1S18.73.65 16 2.48a13.38 13.38.0 00-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07.0 005 4.77 5.44 5.44.0 003.5 8.55c0 5.42 3.3 6.61 6.44 7A3.37 3.37.0 009 18.13V22" / > < / svg > < / a > < a class = "icon ml-1 mr-1" href = /index.xml title = rss > < svg xmlns = "http://www.w3.org/2000/svg" width = "18" height = "18" viewBox = "0 0 24 24" fill = "none" stroke = "currentcolor" stroke-width = "2" stroke-linecap = "round" stroke-linejoin = "round" > < path d = "M4 11a9 9 0 019 9M4 4a16 16 0 0116 16" / > < circle cx = "5" cy = "19" r = "1" / > < / svg > < / a > < / p > < / div > < / div > < / footer > < / body > < / html >