A Brief Introduction to Markdown

THIS ARTICLE WAS NOT AI-GENERATED

I prefer to draft my articles using a Markdown editor. Markdown has a simple syntax for formatting documents. It is easy to convert to other formats, which allows my stories to be published on different platforms.

As this is a brief introduction to Markdown, I won't show alternative syntaxes for achieving the same result or cover all possible Markdown syntaxes.

In this guide, Markdown syntax is followed by the HTML equivalent and the result.

Headings

# Header 1     <h1>Header 1</h1>
## Header 2    <h2>Header 2</h2>
### Header 3   <h3>Header 3</h3>
#### Header 4  <h4>Header 4</h4>

The more hashes, the smaller the heading. To give you an idea of how they work, I would use:

Header 1 for a book title,
Header 2 for a chapter title,
Header 3 for a section heading and
Header 4 for a sub-section heading.

Medium only has two headings (T1 and T2) for the body of a story. When I paste the preview text from a Markdown editor to Medium, Header 3 and Header 4 are converted to T1 and T2. Substack has more headings.

Line Breaks

Some Markdown editors won't show a line break if you only put a Newline (Return) at the end of the line. So, to ensure your text displays properly, I recommend putting two spaces followed by a Return at the end of the line.

New Paragraph

Markdown follows the standard practice of using two Returns to create a new paragraph.

Bold and Italic

**Bold**  <b>Bold</b>
*Italic*  <i>Italic</i>

Bold
Italic

Links

[Learning Pages](https://learningpages.org)
<a href="https://learningpages.org">Learning Pages</a>

Learning Pages

In some Markdown editors, all you need to do is include the link:
https://LearningPages.org

Lists

Unordered Lists

- Red
- Yellow
- Blue
- Green

<ul>
                <li>Red</li>
                <li>Yellow</li>
                <li>Blue</li>
                <li>Green</li>
</ul>

Red
Yellow
Blue
Green

Ordered Lists

1. Item 1
2. Item 2
3. Item 3
4. Item 4

<ol>
                <li>Item 1</li>
                <li>Item 2</li>
                <li>Item 3Item </li>
                <li>Item 4</li>
</ol>

Item 1
Item 2
Item 3
Item 4

Quotes

>"Anger will never disappear so long as thoughts of resentment are cherished in the mind. Anger will disappear just as soon as thoughts of resentment are forgotten."  
>Gautama Buddha (c. 563-483 B.C.)

<blockquote>
<p>"Anger will never disappear so long as thoughts of resentment are cherished in the mind. Anger will disappear just as soon as thoughts of resentment are forgotten."<br> 
Gautama Buddha (c. 563-483 B.C.)</p>
</blockquote>

"Anger will never disappear so long as thoughts of resentment are cherished in the mind. Anger will disappear just as soon as thoughts of resentment are forgotten."
Gautama Buddha (c. 563-483 B.C.)

Email

<[email protected]>
<a href= "mailto:[email protected]">[email protected]</a>

[email protected]

In some Markdown editors, all you need to do is include the link:
[email protected]

Images

![Learning Pages logo](https://mwls.com/images/logos/lp.jpg)

<img src="https://mwls.com/images/logos/lp.jpg">

It isn't possible to set the horizontal alignment of images and tables in Markdown, but they can be overcome, like other Medium limitations, by using HTML within the Markdown script.

If you are using Medium or Substack, images are automatically centred.

Tables

|     |Left|Centre|Right|
|-----|:---|:----:|----:|
|Row 1|L   |C     |R    |
|Row 2|L   |C     |R    |

Horizontal alignment of the columns depends on the number and position of colons in the second row.

The HTML version of this table is:

<table border=1 cellspacing=0 cellpadding=5>
                <tr><th><th><th>Left<th align=center>Centre<th align=right>Right</tr>
                <tr><td>Row 1<td>L<td align=center>C<td align=right>R</tr>
                <tr><td>Row 2<td>L<td align=center>C<td align=right>R</tr>
</table>

	Left	Centre	Right
Row 1	L	C	R
Row 2	L	C	R

Code Blocks

I have used code blocks to show the Markdown and HTML syntaxes in this article. A code block starts and ends with ```

```
if (x > y) {
print "x is greater than y";
}
```

In HTML, the <code> tag is nested inside a <pre> tag to ensure the code is preformatted in a fixed-width font.

<pre>
  <code>
   if (x > y) {
     print "x is greater than y";
   }
  </code>
</pre>

Result:

if (x > y) {
                print "x is greater than y";
}

Originally published by LearningPages.org

Sort:

Trending

[-]

yecier (65) 27 days ago

@maylink

$0.00

hivebuzz (74) 27 days ago

Congratulations @learningpages! You have completed the following achievement on the Hive blockchain And have been rewarded with New badge(s)

You received more than 1500 upvotes.
Your next target is to reach 1750 upvotes.

_{You can view your badges on your board and compare yourself to others in the Ranking}
_{If you no longer want to receive notifications, reply to this comment with the word STOP}

hivewatchers (72) 24 days ago

Hello.

There is reasonable evidence that this article is machine-generated.

We would appreciate it if you could avoid publishing AI-generated content (full or partial texts, art, etc.).

Thank you.

Guide: AI-Generated Content = Not Original Content
Hive Guide: Hive 101

If you believe this comment is in error, please contact us in #appeals in Discord.

10 votes