Skip to content
/ markdown Public

This repository contains "The Markdown Guide" by Matt Cone, along with a README.md file featuring personal notes on Markdown's syntax, features, and best practices.

0 stars 0 forks Branches Tags Activity
Star
Notifications You must be signed in to change notification settings

rnaveensrinivas/markdown

BranchesTags

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
README.md
README.md
 
 
The_Markdown_Guide.pdf
The_Markdown_Guide.pdf
 
 

Repository files navigation

Table of Contents

Introduction

Markdown is a lightweight, widely-used, and highly successful markup language created by John Gruber in 2004. It allows you to add formatting elements to plain text documents using simple syntax. For example, you can create headings with the # symbol.

Key Features of Markdown:

  • Readable and Unobtrusive: The syntax is designed to be as readable as plain text, even before rendering. This makes Markdown documents easy to read and work with, even in their raw form.

    The overriding design goal for Markdown's formatting syntax is to make it as readable as possible. The idea is that a Markdown-formatted document should be publishable as-is, as plain text, without looking like it's been marked up with tags or formatting instructions.

  • Replaces WYSIWYG Editors: Markdown has become a modern alternative to WYSIWYG (What You See Is What You Get) editors for creating formatted documents.

  • Simple Yet Powerful: Markdown is easy to learn and powerful enough to create everything from basic documents to complex technical manuals.

  • Versatile Applications: It is used across a wide range of domains, including:

    • Websites
    • Documentation
    • Notes
    • Books
    • Presentations
    • Emails

  • In-Demand Skill: Fun fact: Proficiency in Markdown is often a requirement in job descriptions, especially for roles involving technical writing or documentation.

How Does Markdown Work?

Markdown works through a simple conversion process:

  1. Write your content in a Markdown file with an extension like .md or .markdown.
  2. Pass the file into a Markdown application, which includes a Markdown processor (also called a "parser" or "implementation").
  3. The processor converts Markdown syntax into HTML.

Workflow Diagram

Markdown (.md) -> Markdown Application (contains Markdown Parser) -> HTML (.html)

This streamlined process makes Markdown both efficient and powerful, making it the go-to choice for creating structured and formatted content.

Basic Syntax

Markdown's basic constructs were introduced by its creator, John Gruber, and remain at the core of its simplicity and effectiveness.

Note: You can seamlessly use HTML tags within Markdown files for additional customization.

Headings

Headings in Markdown are created using the # symbol. The number of # symbols corresponds to the heading level, from 1 (largest) to 6 (smallest).

Markdown HTML
# Heading level 1 <h1>Heading level 1</h1>
## Heading level 2 <h2>Heading level 2</h2>
### Heading level 3 <h3>Heading level 3</h3>
#### Heading level 4 <h4>Heading level 4</h4>
##### Heading level 5 <h5>Heading level 5</h5>
###### Heading level 6 <h6>Heading level 6</h6>

Alternate Syntax for Levels 1 and 2

For Heading Level 1 and Heading Level 2, you can use = and - underlines as an alternative to #:

Example

Markdown:

Heading level 1
===============

Heading level 2
---------------

HTML Conversion:

<h1>Heading level 1</h1>

<h2>Heading level 2</h2>

Rendered Output:

Heading level 1

Heading level 2

Paragraphs

Paragraphs are created by separating blocks of text with a blank line. Each block becomes a paragraph in the rendered output.

Example

Markdown:

I really like using Markdown.

I think I'll use it from now on.

HTML Conversion:

<p>I really like using Markdown.</p>

<p>I think I'll use it from now on.</p>

Rendered Output:

I really like using Markdown.

I think I'll use it from now on.

Line Breaks

Line breaks in Markdown allow you to control where text starts on a new line within the same paragraph.

How to Add Line Breaks

Use the HTML <br> tag

Add a <br> tag wherever you want to insert a line break.

This is the first line.<br>
And this is the second line.

Use Double Spaces

Add two spaces ( ) at the end of a line, followed by pressing Enter.

This is the first line.  
And this is the second line.

Example

Markdown:

This is the first line.  
And this is the second line.

HTML Conversion:

<p>This is the first line.<br />
And this is the second line.</p>

Rendered Output:

This is the first line.
And this is the second line.

Emphasis

Markdown provides simple ways to emphasize text using bold, italic, or a combination of both. You can also use strikethrough and underline, though the latter requires HTML.

Bold

To create bold text, use two asterisks (**) or two underscores (__) before and after the text.

Markdown HTML Rendered Output
I love **bold text**. <strong>bold text</strong> I love bold text.
I love __bold text__. <strong>bold text</strong> I love bold text.
Love**is**bold Love<strong>is</strong>bold Loveisbold.

Italic

To italicize text, use one asterisk (*) or one underscore (_) before and after the text.

Markdown HTML Rendered Output
The *cat's meow*. <em>cat's meow</em> The cat's meow.
The _cat's meow_. <em>cat's meow</em> The cat's meow.
A*cat*meow A<em>cat</em>meow Acatmeow.

Bold and Italic

For text that is both bold and italic, use three asterisks (***) or three underscores (___) around the text. You can also mix and match asterisks and underscores.

Markdown HTML Rendered Output
***Important*** text. <strong><em>Important</em></strong> Important text.
___Important___ text. <strong><em>Important</em></strong> Important text.
__*Important*__ text. <strong><em>Important</em></strong> Important text.
**_Important_** text. <strong><em>Important</em></strong> Important text.
_**Important**_ text. <em><strong>Important</strong></em> Important text.

Strikethrough

To apply strikethrough, use double tildes (~~) before and after the text.

Markdown HTML Rendered Output
The world is ~~flat~~ round. <p>The world is <del>flat</del> round.</p> The world is flat round.

Underline

Markdown does not natively support underlining. You can achieve it by using the HTML <u> tag.

Markdown HTML Rendered Output
<u>This sentence is underlined.</u> <u>This sentence is underlined.</u> This sentence is underlined.

Highlight

In Markdown, there is no official syntax for highlighting text. However, you can use HTML <mark> tag for highlighting.

Example:

Markdown:
<mark>This is highlighted text</mark>
Rendered Output:

This is highlighted text

Blockquotes

Blockquotes are a way to indicate that a piece of text is a quotation or is being cited from another source.

Basic Blockquotes

To create a basic blockquote, use the > symbol.

Example:

Markdown
> Dorothy followed her through many rooms.
HTML Conversion
<blockquote>
  <p>Dorothy followed her through many rooms.</p>
</blockquote>
Rendered Output

Dorothy followed her through many rooms.

Blockquotes with Multiple Paragraphs

To include multiple paragraphs within a blockquote, add an empty line between the paragraphs.

Example

Markdown:
> This is the first paragraph.
>
> And this is the second paragraph.
HTML Conversion:
<blockquote>
  <p>This is the first paragraph.</p>
  <p>And this is the second paragraph.</p>
</blockquote>
Rendered Output:

This is the first paragraph.

And this is the second paragraph.

Nested Blockquotes

For nested blockquotes, use multiple > symbols.

Example

Markdown:
> This is the first paragraph created using `>`.
>
>> And this is the nested paragraph created using `>>`.  
>>> And this is the nested nested paragraph created using `>>>`.
HTML Conversion:
<blockquote>
  <p>This is the first paragraph.</p>
  <blockquote>
    <p>And this is the nested paragraph.</p>
    <blockquote>
      <p>And this is the nested nested paragraph.</p>
    </blockquote>
  </blockquote>
</blockquote>
Rendered Ouput

This is the first paragraph created using >.

And this is the nested paragraph created using >>.

And this is the nested nested paragraph created using >>>.

Blockquotes with Other Elements

Blockquotes can include other Markdown elements, such as headers, lists, and emphasis.

Example

Markdown:
> ##### The quarterly results look great!
>
> - Revenue was off the chart.
> - Profits were higher than ever.
>
> *Everything* is going **well**.
HTML Conversion:
<blockquote>
  <h5>The quarterly results look great!</h5>
  <ul>
    <li>Revenue was off the chart.</li>
    <li>Profits were higher than ever.</li>
  </ul>
  <p><em>Everything</em> is going <strong>well</strong>.</p>
</blockquote>
Rendered Output:
The quarterly results look great!
  • Revenue was off the chart.
  • Profits were higher than ever.

Everything is going well.

Lists

Ordered List

An ordered list is created by adding a number followed by a period. A few key points:

  • Always start the list with 1.
  • Numbers in the list do not need to be in sequential order.

Example

Markdown:
1. First item
2. Second item
3. Third item
4. Fourth item

1. First item
1. Second item
1. Third item
1. Fourth item

1. First item
3. Second item
5. Third item
12. Fourth item
HTML Conversion:
<ol>
  <li>First item</li>
  <li>Second item</li>
  <li>Third item</li>
  <li>Fourth item</li>
</ol>
Rendered Output:
  1. First item
  2. Second item
  3. Third item
  4. Fourth item

Nested List Items

To create a nested list, simply indent the list item with four spaces or a tab.

Example:

Markdown:
1. First item
2. Second item
3. Third item
   1. Indented item
   2. Indented item
4. Fourth item
HTML Conversion:
<ol>
  <li>First item</li>
  <li>Second item</li>
  <li>Third item</li>
    <ol>
      <li>Indented item</li>
      <li>Indented item</li>
    </ol>
  <li>Fourth item</li>
</ol>
Rendered Output:
  1. First item
  2. Second item
  3. Third item
    1. Indented item
    2. Indented item
  4. Fourth item

Unordered List

An unordered list can be created using *, -, or + before the line item.

Example:

Markdown:
* First item
* Second item
+ Third item
  + Indented item
- Fourth item
HTML Conversion:
<ul>
  <li>First item</li>
  <li>Second item</li>
  <li>Third item</li>
  <ul>
    <li>Indented item</li>
  </ul>
  <li>Fourth item</li>
</ul>
Rendered Output:
  • First item
  • Second item
  • Third item
    • Indented item
  • Fourth item

Inline Code

To denote a word or phrase as code, enclose it in single backticks (``). example:

Example:

Markdown:

At the command prompt, type `nano`.

Converted HTML:

At the command prompt, type <code>nano</code>.

Rendered Ouput:

At the command prompt, type nano.

Escaping Backticks

If your code snippet contains backticks, you can escape them by using double backticks (`` ``).

Example:

Markdown:
``Use `code` in your Markdown file.``
HTML Conversion:
<code>Use `code` in your Markdown file.</code>
Rendered Output:

Use `code` in your Markdown file.

Code Blocks

Code blocks can be created with indentation (not recommended) or fenced code blocks.

Fenced Code blocks

Fence Code Blocks in Markdown are used to display code with proper formatting and without being interpreted as regular text. These are created using triple backticks (```) or triple tildes (~~~).

```[language]
Code goes here.
```

~~~[language]
Code goes here.
~~~

Example:

Markdown:
```python
  print("hello world")
```
HTML Conversion:
<pre><code class="language-python">
print("hello world")
</code></pre>

This HTML structure uses the <pre> tag for preserving formatting (such as indentation and newlines) and the <code> tag for marking the text as code. The class="language-python" specifies the language for syntax highlighting (if supported).

Rendered Output:
print("hello world")

Horizontal Rules

To create a horizontal rule, use three or more asterisks (***), dashes (---), or underscores (___) on a line by themselves.

Markdown HTML
*** <hr />
--- <hr />
___ <hr />

Links

To create a link in Markdown, enclose the link text in brackets (e.g., [Duck Duck Go]), followed immediately by the URL in parentheses (e.g., (https://duckduckgo.com)).

Markdown HTML Conversion Rendered Output
Use [Duck Duck Go](https://duckduckgo.com). <a href="https://duckduckgo.com">Duck Duck Go</a> Use Duck Duck Go.

Adding Titles

To add a title that appears as a tooltip when hovering over the link, include it inside quotes right after the URL.

Markdown HTML Conversion Rendered Output
Use [Duck Duck Go](https://duckduckgo.com "My search engine!"). <a href="https://duckduckgo.com" title="My search engine!">Duck Duck Go</a> Use Duck Duck Go.

URLs and Email Addresses

You can enclose URLs or email addresses in angle brackets to automatically convert them into clickable links.

Markdown HTML Conversion Rendered Output
<https://eff.org> <a href="https://eff.org">https://eff.org</a> https://eff.org
<fake@example.com> <a href="mailto:fake@example.com">fake@example.com</a> fake@example.com

Formatting Links

You can add emphasis to links by wrapping them in asterisks or underscores before and after the brackets and parentheses.

Markdown HTML Conversion Rendered Output
I love supporting **[EFF](https://eff.org)**. <strong><a href="https://eff.org">EFF</a></strong> I love supporting EFF.
This is the *[EFF](https://eff.org)*. <em><a href="https://eff.org">EFF</a></em> This is the EFF.

Reference-Style Links

Reference-style links allow you to separate the link URLs from the text, making your Markdown cleaner and more readable. These links consist of two parts: an inline reference and a reference elsewhere in the file. You can also add an optional tooltip in quotes.

Example:

Markdown:
This is an example of a [reference-style link][example-link].

You can also add a [second link][second-link] for another reference.

[example-link]: https://www.example.com "Optional Tooltip"
[second-link]: https://www.secondexample.com
HTML Conversion:
<p>This is an example of a <a href="https://www.example.com" title="Optional Tooltip">reference-style link</a>.</p>

<p>You can also add a <a href="https://www.secondexample.com">second link</a> for another reference.</p>
Rendered Output:

This is an example of a reference-style link.

You can also add a second link for another reference.

Images

To insert an image in Markdown, start with an exclamation mark (!), followed by alt text in brackets, and the path or URL to the image in parentheses. Optionally, you can add a title after the URL in the parentheses.

Example:

Markdown:

![Fractal tree taken from Wikipedia!](https://upload.wikimedia.org/wikipedia/commons/4/4d/Fractal_canopy.svg "A fractal tree")

HTML Conversion:

<img src="https://upload.wikimedia.org/wikipedia/commons/4/4d/Fractal_canopy.svg" alt="Fractal tree taken from Wikipedia!" title="A fractal tree" />

Rendered Output:

Fractal tree taken from Wikipedia!

Escaping Characters

To display a literal character that would otherwise be used to format text in a Markdown document, add a backslash \ in front of the character.

Example:

Markdown:

\* Without the backslash, this would be a bullet in an unordered list.

HTML Conversion:

<p>* Without the backslash, this would be a bullet in an unordered list.</p>

Rendered Output:

* Without the backslash, this would be a bullet in an unordered list.

Characters You Can Escape

You can use a backslash to escape the following characters:

Character Name
\ backslash
` tick mark
* asterisk
_ underscore
{ } curly braces
[ ] brackets
( ) parentheses
# pound sign
+ plus sign
- minus sign (hyphen)
. dot
! exclamation mark
| pipe

Subscript Text

In standard Markdown, there is no built-in syntax for subscript text. However, you can use HTML tags (<sub>) for subscript text.

Example:

Markdown:

H<sub>2</sub>O

Rendered Output:

H2O

Alternative (GitHub Flavored Markdown)

In GitHub Flavored Markdown (GFM), you can use tilde (~) around the text for subscript:

Example:

Markdown:
H~2~O
HTML Conversion:
H<sub>2</sub>O
Rendered Output:

H2O

Superscript Text

In standard Markdown, there is no built-in syntax for superscript text. However, you can use HTML tags (<sup>) for superscript text.

Example:

Markdown:

E = mc<sup>2</sup>

Rendered Output:

E = mc2

Alternative (GitHub Flavored Markdown)

In GitHub Flavored Markdown (GFM), you can use caret (^) around the text for superscript:

Example:

Markdown:
E = mc^2
HTML Conversion:
E = mc<sup>2</sup>
Rendered Output:

E = mc^2

Extended Syntax

Markdown, as introduced by John Gruber, offers a simple and efficient way to format text. While the basic syntax is powerful, users wanted more flexibility. This led to the addition of features such as tables, code blocks, syntax highlighting, URL auto-linking, and footnotes. One of the most popular extensions is GitHub Flavored Markdown (GFM).

Tables

Tables allow you to present data in an organized tabular format. Below are the guidelines and examples for creating tables:

Creating a Table

To create a table in Markdown:

  1. Use three or more hyphens (---) to create the header row separator.
  2. Separate columns with pipes (|).
  3. Although optional, it’s recommended to add pipes at the beginning and end of each row for better readability.
  4. You can include links, inline code, and text formatting (like italic and bold) in tables.
  5. Limitations: Markdown tables don’t support features like headings, blockquotes, lists, horizontal rules, images, or raw HTML.

Example:

Markdown:
| Syntax      | Description |
|-------------|-------------|
| Header      | Title       |
| Paragraph   | Text        |
HTML Conversion:
<table>
  <thead>
    <tr class="header">
      <th>Syntax</th>
      <th>Description</th>
    </tr>
  </thead>
  <tbody>
    <tr class="odd">
      <td>Header</td>
      <td>Title</td>
    </tr>
    <tr class="even">
      <td>Paragraph</td>
      <td>Text</td>
    </tr>
  </tbody>
</table>
Rendered Output:
Syntax Description
Header Title
Paragraph Text

Alignment

You can align the content of table columns by using colons (:) within the header row:

  • :--- for left alignment.
  • :---: for center alignment.
  • ---: for right alignment.

Example:

Markdown:
| Syntax      | Description   | Test Text   |
|:------------|:-------------:|------------:|
| Header      | Title         | Here's this |
| Paragraph   | Text          | And more    |
Conversion to HTML:
<table>
  <thead>
    <tr class="header">
      <th style="text-align: left;">Syntax</th>
      <th style="text-align: center;">Description</th>
      <th style="text-align: right;">Test Text</th>
    </tr>
  </thead>
  <tbody>
    <tr class="odd">
      <td style="text-align: left;">Header</td>
      <td style="text-align: center;">Title</td>
      <td style="text-align: right;">Here’s this</td>
    </tr>
    <tr class="even">
      <td style="text-align: left;">Paragraph</td>
      <td style="text-align: center;">Text</td>
      <td style="text-align: right;">And more</td>---

    </tr>
  </tbody>
</table>
Rendered Output:
Syntax Description Test Text
Header Title Here's this
Paragraph Text And more

Pro Tip

Creating tables manually in Markdown can be time-consuming. To speed up the process, consider using a tool like Tables Generator, which provides a graphical interface to create tables and automatically generates the Markdown code for you.

Syntax Highlighting for Fenced Code Blocks

You can add syntax highlighting to your code by specifying the language next to the backticks (```) before the fenced code block. This helps make the code more readable by applying color highlighting based on the language used.

Example:

Markdown:

```json
{
  "firstName": "John",
  "lastName": "Smith",
  "age": 25
}
```

HTML Conversion:

<pre>
  <code class="language-json">
    {
      &quot;firstName&quot;: &quot;John&quot;,
      &quot;lastName&quot;: &quot;Smith&quot;,
      &quot;age&quot;: 25
    }
  </code>
</pre>

Rendered Output:

{
  "firstName": "John",
  "lastName": "Smith",
  "age": 25
}

Heading IDs

In Markdown, headings automatically generate unique IDs that can be used for linking. These IDs are created by converting the heading text into a hyphen-separated, case-insensitive format.

How It Works:

  • The text of the heading becomes the ID.
  • The ID is a lowercase, hyphen-separated version of the heading text.
  • For example, a heading like ## Heading IDs will generate the ID heading-ids.

Example:

Markdown

## Heading IDs

HTML Conversion

<h2 id="heading-ids">My Great Heading</h2>

Linking to the Heading

We can link to any heading using the links markdown construct.

Example:

Markdown

Link to [Heading IDs](#heading-ids)

Rendered Output:

Link to Heading IDs

Task Lists

Task lists in Markdown allow you to create a list of items with checkboxes. These checkboxes help you track progress by marking items as completed or not.

How It Works:

  • To create a task list, use dashes (-), asterisks (*), or plus signs (+) followed by brackets with a space ([ ]) to represent incomplete tasks.
  • To mark a task as completed, place an x inside the brackets ([x]).

Example:

Markdown:

- [x] Write the press release
- [ ] Update the website
- [ ] Contact the media

HTML Conversion:

<ul>
  <li><input type="checkbox" checked> Write the press release</li>
  <li><input type="checkbox"> Update the website</li>
  <li><input type="checkbox"> Contact the media</li>
</ul>

Rendered Output:

  • Write the press release
  • Update the website
  • Contact the media

Automatic URL Linking

Markdown processors automatically convert URLs into clickable links, even if you don’t wrap them in angular brackets (< >).

Example:

Markdown:

https://github.com/

HTML Conversion:

<a href="https://github.com/">https://github.com/</a>

Rendered Output:

https://github.com/

Disabling Automatic URL Linking

If you don’t want Markdown to automatically turn a URL into a clickable link, you can prevent it by denoting the URL as code using tick marks.

Example:

Markdown:

`https://github.com/`

HTML Conversion:

<code>https://github.com/</code>

Rendered Output:

https://github.com/

Emoji

Using GitHub-style emoji shortcodes:

You can use shortcodes enclosed in colons (:).

Example:

Markdown:
:smile: :heart: :rocket:
HTMl Conversion:
<span class="emoji">😀</span> <span class="emoji">❤️</span> <span class="emoji">🚀</span>
Rendered Output:

😄 ❤️ 🚀

Using Unicode emojis:

You can directly insert emojis by copying and pasting the character.

Example:

Markdown:
😀 ❤️ 🚀
HTML Conversion:
<span class="emoji">😀</span> <span class="emoji">❤️</span> <span class="emoji">🚀</span>
Rendered Output:

😀 ❤️ 🚀

Hidden Text

Markdown itself doesn't provide a native feature to hide content. However, you can achieve this behavior in certain environments that support additional functionality.

HTML <details> and <summary> tags (in supported Markdown environments)

You can use HTML tags to create collapsible sections in environments like GitHub or GitLab that support HTML rendering in Markdown:

HTML Code

<details>
<summary>Click to expand</summary>

Your hidden content goes here.

</details>

This will create a collapsible section. When you click "Click to expand," it will show the hidden content.

Rendered Output

Click to expand

Your hidden content goes here.

LaTeX Mathematical Notations

You can use LaTeX to write mathematical expressions in Markdown. Inline and block math can be easily added by enclosing expressions in dollar signs.

Inline Math

To display math inline (within the text), enclose the expression in single dollar signs ($).

Example:

Markdown:

This is an inline math expression: $E = mc^2$.

Rendered Output:

This is an inline math expression: $E = mc^2$.

Block Math (Display Math)

To display math in a block format (centered and on its own line), enclose the expression in double dollar signs ($$).

Example:

Markdown:

$$
\int_0^\infty x^2 \, dx
$$

Rendered Output:

$$ \int_0^\infty x^2 , dx $$

Superscripts and Subscripts

In LaTeX, you can use superscripts (^) and subscripts (_) for mathematical expressions.

Example:

Markdown:

$x^2$  (Superscript)  
$x_1$  (Subscript)

Rendered Output:

$x^2$ (Superscript) - $x_1$ (Subscript)

Fractions

To create fractions, use the LaTeX command \frac{numerator}{denominator}.

Example:

Markdown:

$\frac{a}{b}$

Rendered Output:

$\frac{a}{b}$

Square Roots

To create square roots, use the LaTeX command \sqrt{expression}.

Example:

Markdown:

$\sqrt{x^2 + y^2}$

Rendered Output:

$\sqrt{x^2 + y^2}$

Greek Letters

You can use LaTeX commands to display Greek letters.

Example:

Markdown:

$\alpha$, $\beta$, $\gamma$, $\delta$, $\pi$, $\theta$

Rendered Output:

$\alpha, \beta, \gamma, \delta, \pi, \theta$

Summation and Product Notation

To represent summation and product notation, use \sum and \prod, respectively.

Example:

Markdown:

$\sum_{i=1}^n x_i$  (Summation)  
$\prod_{i=1}^n x_i$  (Product)

Rendered Output:

$$ \sum_{i=1}^n x_i $$ $$ \prod_{i=1}^n x_i $$

Limits

Use the LaTeX command \lim to represent limits in mathematical expressions.

Example:

Markdown:

$\lim_{x \to \infty} f(x)$

Rendered Output:

$\lim_{x \to \infty} f(x)$

$$ \lim_{x \to \infty} f(x) $$

Integral Notation

To represent integrals, use \int.

Example:

Markdown:

$\int_{0}^{\infty} e^{-x} dx$

Rendered Output:

$\int_{0}^{\infty} e^{-x} dx$

Matrices

To create matrices, use the \begin{matrix} ... \end{matrix} syntax.

Example:

Markdown:

$$
\begin{matrix}
1 & 2 & 3 \\
4 & 5 & 6 \\
7 & 8 & 9
\end{matrix}
$$

Rendered Output:

$$ \begin{matrix} 1 & 2 & 3 \\ 4 & 5 & 6 \\ 7 & 8 & 9 \end{matrix} $$

Aligning Equations

To align equations, use the align environment with & to specify the alignment points.

Example:

Markdown:

$$
\begin{align}
  x + y &= z \\
  a + b + c &= d
\end{align}
$$

Rendered Output:

$$ \begin{align} x + y &= z \\ a + b + c &= d \end{align} $$

Exponents and Logarithms

Use \exp for exponentials and \log for logarithms.

Example:

Markdown:

$\exp(x)$  (Exponential)  
$\log(x)$  (Logarithm)

Rendered Output:

$\exp(x)$ (Exponential)
$\log(x)$ (Logarithm)

Binomial Coefficient

Use \binom{n}{k} for binomial coefficients.

Example:

Markdown:

$\binom{n}{k}$

Rendered Output:

$$ \binom{n}{k} $$

Brackets and Parentheses

To automatically adjust the size of brackets and parentheses, use \left and \right.

Example:

Markdown:

$\left( \frac{a}{b} \right)$

Rendered Output:

$$ \left( \frac{a}{b} \right) $$

Derivatives and Differential Operators

Use \frac{d}{dx} for derivatives.

Example:

Markdown:

$\frac{d}{dx} f(x)$

Rendered Output:

$$ \frac{d}{dx} f(x) $$

Angle Notations

To denote angles, use \angle.

Example:

Markdown:

$\angle ABC$

Rendered Output:

$$ \angle ABC $$

Vectors and Matrices

Use \vec{} for vectors and \mathbf{} for bold matrices.

Example:

Markdown:

$\vec{v}$  (Vector)  
$\mathbf{M}$  (Matrix)

Rendered Output:

$\vec{v}$ (Vector)
$\mathbf{M}$ (Matrix)

Absolute Value

To denote absolute value, use \left| ... \right|.

Example:

Markdown:

$\left| x \right|$

Rendered Output:

$\left| x \right|$

Complex Expressions

You can combine all of these symbols to create complex mathematical expressions.

Example:

Markdown:

$$
\frac{\int_0^1 e^x \, dx}{\sqrt{1 + x^2}} + \sum_{n=0}^{\infty} \frac{1}{n!}
$$

Rendered Output:

$$ \frac{\int_0^1 e^x , dx}{\sqrt{1 + x^2}} + \sum_{n=0}^{\infty} \frac{1}{n!} $$

Cheat Sheet

Element Markdown Syntax
Heading 1 # heading 1
heading 1
=====
Heading 2 ## heading 2
heading 2
-----
Heading 3 ### heading 3
Heading 4 #### heading 4
Heading 5 ##### heading 5
Heading 6 ###### heading 6
Paragraph Leave a blank line between text
Line Break <br>
or add two spaces at the end of the line
Bold __bold__
**bold**
Italic *italic*
_italic_
Bold + Italic **_BoldAndItalic_**
***BoldAndItalic***
___BoldAndItalic___
__*BoldAndItalic*__
_**BoldAndItalic**_
Strikethrough ~~strikethrough~~
Underline <u>underline</u>
Highlight <mark>Highlight</mark>
Blockquote > Block quotes
Blockquote with paragraph > Block quotes paragraph 1
>
> Block quotes paragraph 2
Nested Blockquote >> Block quotes
>> Nested Block quotes
>>> Double nested block quotes
Blockquote with Formatting > # Can have other elements
>> It can have _italic_ and **bold**
Ordered List 1. Item
2. Item

1. Item
1. Item

1. Item
3. Item

Unordered List * Item
- Item
+ Item
Nested List Indent with spaces or tabs
Inline Code `inline code`
Code Block ```plaintext` <br> `... code block ...`
Horizontal Rule ---
***
___
Link [Link Text](URL "title")
Link 2 <url.can.be.enclosed.in.angular.brackets.to.make.them.clickable.links.com>
<you.can.also.have@mail.here>
Link to Headings [Heading " Name / Hypen &* Separated ignOring SpEciaL SymboLS](#heading-name-hypen-separated-ignoring-special-symbols)
Reference Link [Reference Text][ref]
[ref]: URL "title"
Image ![Alt Text](URL "title")
Escaping Characters \*Escaped Characters\*
Subscript <sub>subscript</sub>
Superscript <sup>superscript</sup>
Table | Heading 1 | Heading 2 | Heading 3 |
|:---|:---:|:---|
|right align|center align|left align|
Task List - [ ] Task
- [x] Completed Task
* [ ] Incompleted Task
Automatic URL Linking http://example.com
Disable URL Linking `http://example.com`
Inline Math $E = mc^2$
Block Math $$ \int_0^\infty x^2 dx $$
Superscript $x^2$
Subscript $x_1$
Fraction $\frac{a}{b}$
Square Root $\sqrt{x^2 + y^2}$
Greek Letters $\alpha$
$\beta$
$\gamma$
$\delta$
$\pi$
$\theta$
Summation $\sum_{i=1}^n x_i$
Product Notation $\prod_{i=1}^n x_i$
Limits $\lim_{x \to \infty} f(x)$
Integrals $\int_{0}^{\infty} e^{-x} dx$
Matrices $$ \begin{matrix} 1 & 2 \\ 3 & 4 \end{matrix} $$
Aligned Equations $$ \begin{align} x + y &= z \\ a &= b + c \end{align} $$
Exponents/Logarithms $\exp(x)$
$\log(x)$
Binomial Coefficient $\binom{n}{k}$
Brackets $\left( \frac{a}{b} \right)$
Derivative $\frac{d}{dx} f(x)$
Angle $\angle ABC$
Vector $\vec{v}$
Absolute Value $\left| x \right|$
Complex Expression $$ \frac{\int_0^1 e^x dx}{\sqrt{1 + x^2}} + \sum_{n=0}^{\infty} \frac{1}{n!} $$

About

This repository contains "The Markdown Guide" by Matt Cone, along with a README.md file featuring personal notes on Markdown's syntax, features, and best practices.

Topics

markdown markdown-language markdown-lang

Resources

Readme
Activity

Stars

0 stars

Watchers

1 watching

Forks

0 forks
Report repository