markup: text style | non-ascii punctuation | grouping and alignment | tables, code, and mathpsp
mathematical notation: general | fractions and radicals | relations and operators | sets and logic | geometry | analysis | matrices | algebra | arrows | accents | greek letters | fonts
typesetting math: latex | mathjax | google charts
tex | |
---|---|
sandbox | https://www.latex-tutorial.com/sandbox/ |
command line tool | $ sudo apt-get install texlive-full $ pdflatex On Mac, install http://www.tug.org/mactex/. Then find pdflatex in what gets installed and place a link to it in your search path. |
hello world | \documentclass{article} gray|% \usepackage statements go here## \begin{document} Hello world! \end{document} |
comment | % comment |
text style | |
tex | |
italic text | \emph{italic text} \textit{italic text} |
bold text | \textbf{bold text} |
small caps text | \textsc{small caps text} |
fixed width text | \texttt{fixed width text} |
underlined text | \underline{underlined text} |
striketrhough text | \usepackage{ulem} \sout{strikethrough text} |
literal text | textbackslash{}emph\{not italics\} special characters: # $ % ^ & _ { } ~ \ how to escape: \# \$ \% \textasciicircum{} \& \_ \{ \} \~{ } \textbackslash{} |
superscript2 | superscript\textsuperscript{2} |
subscript2 | subscript\textsubscript{2} |
font color | \usepackage{color} \textcolor{red}{red text} |
font size | Set font size for document: \documentclass[12pt]{report} Set font size for paragraph: \begin{Large} Lorem ipsum dolor sit amet \end{Large} Set font size inline: {\Large Lorem ipsum\par} dolor sit amet Font size names: \Huge \huge \LARGE \Large \large \normalsize \small \footnotesize \scriptsize \tiny |
non-ascii punctuation | |
tex | |
right and left single quotes: ‘lorem ipsum’ | `lorem ipsum' |
right and left double quotes: “lorem ipsum” | ``lorem ipsum'' |
en dash: – | -- |
em dash: — | --- |
ellipsis: … | \ldots |
grouping and alignment | |
tex | |
paragraphs | Separate paragraphs with an empty line: This is paragraph 1. This is paragraph 2. |
line break | \\ |
horizontal rule | \hrulefill |
horizontal dots | \dotfill |
align left | {\flushleft Left aligned } |
align right | {\flushright Right aligned } |
align center | {\center Centered } |
document title | \title{document title} |
section header | \section{section header} |
subsection header | \subsection{subsection header} |
subsubsection header | \subsubsection{subsubsection header} |
list item | \begin{itemize} \item list item \begin{itemize} \item sublist item \end{itemize} \end{itemize} |
numbered list item | \begin{enumerate} \item numbered one \item numbered two \end{enumerate} |
definition list | \begin{description} \item[one] the 1st cardinal \item[two] the 2nd cardinal \end{description} |
block quote | \begin{quote} Four score and twenty years ago… \end{quote} |
tables, code, and math | |
tex | |
table | \begin{tabular}{l l} A & B \\ \hline 1 & 2 \\ 3 & 4 \\ \end{tabular} |
pre-formatted fixed-width block with no need to escape markup or < and & | \begin{verbatim} int add(int a, int b) { return (a+b); } \end{verbatim} |
inline math | \( \int_0^\infty \frac{1}{x^2} dx \) \begin{math} \int_0^\infty \frac{1}{x^2} dx \end{math} |
block math | \[ \int_0^\infty \frac{1}{x^2} dx \] \begin{displaymath} \int_0^\infty \frac{1}{x^2} dx \end{displaymath} |
________________ | __________________________________________________ |
latex | |
---|---|
$x^2$ | x^2 |
$x_2$ | x_2 |
90° | 90^\circ |
$( \big( \Big( \bigg( \Bigg($ | ( \big( \Big( \bigg( \Bigg( |
spaces of decreasing width | \; \: \, \! |
$\binom{n}{k}$ | \binom{n}{k} |
$\Re(z) \;\; \Im(z)$ | \Re(z) \Im(z) |
fractions and radicals | |
latex | |
$\frac{x+1}{y+1}$ | \frac{x+1}{y+1} |
$^3/_7$ | ^3/_7 |
$\left( \frac{x+1}{y+1} \right)$ | \left( \frac{x+1}{y+1} \right) |
$\left| \frac{x}{1+x} \right|$ | \left| \frac{x}{1+x} \right| |
$\sqrt{2}$ | \sqrt{2} |
$\sqrt[3]{x}$ | \sqrt[3]{x} |
relations and operators | |
latex | |
≤ ≥ | \le \ge |
≠ | \neq |
$\approx \;\; \not\approx$ | \approx \not\approx |
$\simeq \;\; \cong$ | \simeq \cong |
$\equiv \;\; \not\equiv$ | \equiv \not\equiv |
± ∓ | \pm \mp |
× ÷ | \times \div |
$\mathbf{a} \cdot \mathbf{b}$ | \mathbf{a} \cdot \mathbf{b} |
$(g \circ f)'(t) = g'(f(t))\;f'(t)$ | (g \circ f)'(t) = g'(f(t)) f'(t) |
≮ ≯ | \not< \not> |
≰ ≱ | \not\le \not\ge |
sets and logic | |
latex | |
∅ | \emptyset |
∈ ∉ | \in \notin |
⊂ ⊆ | \subset \subseteq |
⊄ ⊈ | \not\subset \not\subseteq |
⊊ ⊋ | \subsetneq \supsetneq |
⊃ ⊇ | \supset \supseteq |
$\cup \cap$ | \cup \cap |
$\bigcup$ | \bigcup |
$\bigcap$ | \bigcap |
∖ | \setminus |
א | \aleph |
¬ | \neq |
∧ ∨ | \wedge \vee |
⊻ | \veebar |
∀ ∃ | \forall \exists |
⊤ ⊥ | \top \bot |
∴ | \therefore |
⊢ ⊨ | \vdash \models |
∎ | \blacksquare |
geometry | |
latex | |
$\overline{AB}$ | \overline{AB} |
$\overrightarrow{AB}$ | \overrightarrow{AB} |
$\overleftrightarrow{AB}$ | \overleftrightarrow{AB} |
$\angle ABC$ | \angle ABC |
$\triangle ABC$ | \triangle ABC |
$\overline{AB} \perp \overline{XY}$ | \overline{AB} \perp \overline{XY} |
$\overline{AB} \parallel \overline{XY}$ | \overline{AB} \parallel \overline{XY} |
$\triangle ABC \cong \triangle XYZ$ | \triangle ABC \cong \triangle XYZ |
$\triangle ABC \sim \triangle XYZ$ | \triangle ABC \sim \triangle XYZ |
analysis | |
latex | |
$\begin{cases}x & x \ge 0 \\ -x & x < 0 \end{cases}$ | \begin{cases} x & x \ge 0 \\ -x & x < 0 \end{cases} |
$\lfloor x \rfloor$ | \lfloor x \rfloor |
$\lceil x \rceil$ | \lceil x \rceil |
$\|x\|$ | \|x\| |
$\langle x, y \rangle$ | \langle x, y \rangle |
$\frac{1}{\widehat{f(x)}}$ | \widehat{f(x)} |
∞ | \infty |
$\Delta x$ | \Delta x |
$\nabla f\:(x, y, z)$ | \nabla f(x, y, z) |
$\frac{\partial f}{\partial x}$ | \frac{\partial f}{\partial x} |
$\sum_{i=1}^n i$ | \sum_{i=1}^n i |
$\prod_{i=1}^n i$ | \prod_{i=1}^n i |
${\displaystyle \lim_{h \to 0} \frac{f(x+h) - f(x)}{h} }$ | \lim_{h \to 0} \frac{f(x+h) - f(x)}{h} |
$\int_0^{2\pi}\cos x\,dx$ | \int_0^{2\pi}\cos x\,dx |
$\cos x |_{x=\pi}$ | \cos x |_{x=\pi} |
$\oint_C \frac{1}{z} dz$ | \oint_C \frac{1}{z} dz |
matrices | |
latex | |
$\begin{matrix} 1 & 2 \\ 3 & 4 \end{matrix}$ | \begin{matrix} 1 & 2 \\ 3 & 4 \end{matrix} |
$\begin{array}{c|c} 1 & 2 \\ 3 & 4 \end{array}$ | \begin{array}{c|c} 1 & 2 \\ 3 & 4 \end{array} |
$\begin{array}{cc} 1 & 2 \\ \hline 3 & 4 \end{array}$ | \begin{array}{cc} 1 & 2 \\ \hline 3 & 4 \end{array} |
$\begin{bmatrix} 1 & 2 \\ 3 & 4 \end{bmatrix}$ | \begin{bmatrix} 1 & 2 \\ 3 & 4 \end{bmatrix} |
$\begin{pmatrix} 1 & 2 \\ 3 & 4 \end{pmatrix}$ | \begin{pmatrix} 1 & 2 \\ 3 & 4 \end{pmatrix} |
$\begin{matrix} 0 & \cdots & 0 \\ \vdots & \ddots & \vdots \\ 0 & \cdots & 0 \end{matrix}$ | \begin{matrix} 0 & \cdots & 0 \\ \vdots & \ddots & \vdots \\ 0 & \cdots & 0 \end{matrix} |
algebra | |
latex | |
$p \not|\; p + 1$ | p \not| p + 1 |
$\oplus \otimes$ | \oplus \otimes |
$\bigoplus \bigotimes$ | \bigoplus \bigotimes |
$N \triangleleft G$ $N \unlhd G$ |
N \triangleleft G N \unlhd G |
$H\; \rtimes_\phi \;K$ | H \rtimes_\phi K |
$L \wr K$ | L \wr K |
arrows | |
latex | |
$\rightarrow \leftarrow \uparrow \downarrow$ | \rightarrow \leftarrow \uparrow \downarrow |
↖↗↘↙ | \nwarrow \nearrow \searrow \swarrow |
$\Rightarrow \Leftarrow \Uparrow \Downarrow$ | \Rightarrow \Leftarrow \Uparrow \Downarrow |
$\mapsto$ | \mapsto |
$\leftrightarrow$ | \leftrightarrow |
$\Leftrightarrow$ | \Leftrightarrow |
↣ | \rightarrowtail |
↠ | \twoheadrightarrow |
↪ | \hookrightarrow |
accents | |
latex | |
$x' \; x'' \; x'''$ | x' x'' x''' |
$\hat{x}$ | \hat{x} |
$\bar{x}$ | \bar{x} |
$\vec{x}$ | \vec{x} |
$\tilde{x}$ | \tilde{x} |
$\dot{x}$ | \dot{x} |
$\ddot{x}$ | \ddot{x} |
greek letters | |
latex | |
Α α | \Alpha \alpha |
Β β | \Beta \beta |
Γ γ | \Gamma \gamma |
Δ δ | \Delta \delta |
Ε ε | \Epsilon \epsilon |
Ζ ζ | \Zeta \zeta |
Η η | \Eta \eta |
Θ θ | \Theta \theta |
Ι ι | \Iota \iota |
Κ κ | \Kappa \kappa |
Λ λ | \Lambda \lambda |
Μ μ | \Mu \mu |
Ν ν | \Nu \nu |
Ξ ξ | \Xi \xi |
Ο ο | \Omicron \omicron |
Π π | \Pi \pi |
Ρ ρ | \Rho \rho |
Σ σ | \Sigma \sigma |
Τ τ | \Tau \tau |
Υ υ | \Upsilon \upsilon |
Φ φ | \Phi \phi |
Χ χ | \Chi \chi |
Ψ ψ | \Psi \psi |
Ω ω | \Omega \omega |
fonts | |
latex | |
roman | \textrm{roman} \mathrm{roman} |
italic | \textit{italic} \mathit{italic} |
bold | \textbf{bold} \mathbf{bold} |
fixed width | \texttt{fixed width} \mathtt{fixed width} |
predefined color | \usepackage{color} \textcolor {blue}{blue text} |
RGB color | \usepackage{color} \textcolor [rgb]{1,0,0}{red text} |
ℕ ℤ ℚ ℝ ℂ |
\mathbb{N} \mathbb{Z} \mathbb{Q} \mathbb{R} \mathbb{C} |
$\mathcal{A, B, C, \ldots}$ $\mathcal{a, b, c, \ldots}$ |
\mathcal{A, B, C, \ldots} \mathcal{a, b, c, \ldots} |
$\mathfrak{A, B, C, \ldots}$ $\mathfrak{a, b, c, \ldots}$ |
\mathfrak{A, B, C, \ldots} \mathfrak{a, b, c, \ldots} |
LaTeX
- MacTeX
- MiKTeX
- LaTeX (wikibooks.org)
- LaTeX/Mathematics (wikibooks.org)
to HTML:
$ pandoc foo.txt -o foo.html
to PDF:
$ pdflatex foo.tex
MathJax
MathJax is a JavaScript solution for putting LaTeX into HTML. The necessary JavaScript file is hosted at mathjax.org. Here is an example of how to use it:
<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
<p>
The Greeks observed that \( \sqrt{2} \) cannot be expressed as a rational number.
<p>
Moreover, they knew that for a right triangle with hypotenuse <em>c</em>:
$$ c^2 = a^2 + b^2 $$
Google Charts
The feature is undocumented, but it is possible to send a GET request with url encoded LaTeX to the Google Charts API and get a PNG in return. Thus HTML like this is possible:
<img src="http://chart.apis.google.com/chart?cht=tx&chl=URLENCODED_LATEX"/>
Url encoded LaTeX is unmaintainable, however. A better approach might use HTML like this:
Inline Math: <span class="latex">\int_0^\infty \cos x dx</span> <p> Centered Math: <div class="latex"> \frac{1+x}{1+y} </div>
The above HTML must be processed by the following JavaScript, which should be put in the document after the tags it needs to process:
var LATEX = {}; LATEX.url = "http://chart.apis.google.com/chart?cht=tx&chl="; LATEX.process = function() { elements = document.getElementsByClassName("latex"); for (var i=0; i<elements.length; i++ ) { element = elements[i]; if ( "div" == element.tagName.toLowerCase() ) { LATEX.replace_div(element); } else if ( "span" == element.tagName.toLowerCase() ) { LATEX.replace_span(element); } } }; LATEX.replace_span = function(element) { img = document.createElement('img'); img.setAttribute('src', LATEX.url + encodeURIComponent(element.innerHTML)); img.setAttribute('class', 'latex'); img.setAttribute('style', 'vertical-align: bottom'); element.parentNode.replaceChild(img, element) } LATEX.replace_div = function(element) { p = document.createElement('p'); p.setAttribute('class', 'latex'); p.setAttribute('style', 'text-align: center'); img = document.createElement('img'); img.setAttribute('src', LATEX.url + encodeURIComponent(element.innerHTML)); p.appendChild(img); element.parentNode.replaceChild(p, element); }; LATEX.process();