-
Notifications
You must be signed in to change notification settings - Fork 64
Showdown Markdown Syntax
PerfKit Explorer supports Showdown, a Markdown to HTML converter written in JavaScript. To learn more, visit https://github.com/showdownjs/showdown/wiki/Showdown's-Markdown-syntax.
Paragraphs in Markdown are just one or more lines of consecutive text followed by one or more blank lines.
On July 2, an alien mothership entered Earth's orbit and deployed several dozen
saucer-shaped "destroyer" spacecraft, each 15 miles (24 km) wide.
On July 3, the Black Knights, a squadron of Marine Corps F/A-18 Hornets,
participated in an assault on a destroyer near the city of Los Angeles.The implication of the “one or more consecutive lines of text” is that Markdown supports “hard-wrapped” text paragraphs. This means the following examples produce the same output:
A very long line of textA very
long line
of textIf you DO want to add soft line breaks (which translate to <br> in HTML) to a paragraph,
you can do so by adding 3 space characters to the end of the line ( ).
You can create a heading by adding one or more # symbols before your heading text. The number of # you use will determine the size of the heading. This is similar to atx style.
# The largest heading (an <h1> tag)
## The second largest heading (an <h2> tag)
…
###### The 6th largest heading (an <h6> tag)The space between # and the heading text is not required but you can make that space mandatory by enabling the option requireSpaceBeforeHeadingText.
You can wrap the headings in #. Both leading and trailing # will be removed.
## My Heading ##You can also use setext style headings, although only two levels are available.
This is an H1
=============
This is an H2
-------------Markdown generates bookmarks anchors in titles automatically, by adding an id property, based on the heading text, to the heading.
You can indicate blockquotes with a >.
In the words of Abraham Lincoln:
> Pardon my frenchBlockquotes can have multiple paragraphs and can have other block elements inside.
> A paragraph of text
>
> Another paragraph
>
> - A list
> - with itemsYou can make text bold, italic or strikethrough
*This text will be italic*
**This text will be bold**
~~This text will be strikedthrough~~
Both bold and italic can use either a * or an _ around the text for styling. This allows you to combine both bold and italic if needed.
**Everyone _must_ attend the meeting at 5 o'clock today.**
Use single backticks (`) to format text in a special monospace format. Everything within the backticks appear as-is, with no other special formatting.
Here's an idea: why don't we take `SuperiorProject` and turn it into `**Reasonable**Project`.<p>Here's an idea: why don't we take <code>SuperiorProject</code> and turn it into <code>**Reasonable**Project</code>.</p>To create blocks of code you should indent it by four spaces.
this is a piece
of
code
You can also use triple backticks (```) to format text as its own distinct block.
Check out this neat program I wrote:
```
x = 0
x = 2 + 2
what is x
```
Markdown supports ordered (numbered) and unordered (bulleted) lists.
You can make an unordered list by preceding list items with either a *, a - or a +. Markers are interchangeable too.
* Item
+ Item
- ItemYou can make an ordered list by preceding list items with a number.
1. Item 1
2. Item 2
3. Item 3It’s important to note that the actual numbers you use to mark the list have no effect on the HTML output Markdown produces. So you can use the same number in all items if you wish to.
Markdown also supports GFM styled takslists.
- [x] checked list item
- [ ] unchecked list item- checked list item
- unchecked list item
List markers typically start at the left margin, but may be indented by up to three spaces.
* this is valid
* this is too List markers must be followed by one or more spaces or a tab.
To make lists look nice, you can wrap items with hanging indents:
* Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi,
viverra nec, fringilla in, laoreet vitae, risus.
* Donec sit amet nisl. Aliquam semper ipsum sit amet velit.
Suspendisse id sem consectetuer libero luctus adipiscing.But if you want to be lazy, you don’t have to
If one list item is separated by a blank line, Markdown will wrap all the list items in <p> tags in the HTML output.
So this input:
* Bird
* Magic
* JohnsonResults in:
<ul>
<li><p>Bird</p></li>
<li><p>Magic</p></li>
<li><p>Johnson</p></li>
</ul>This differs from other markdown implementations such as GFM (github) or commonmark.
List items may consist of multiple paragraphs. Each subsequent paragraph in a list item must be indented by either 4 spaces or one tab:
1. This is a list item with two paragraphs. Lorem ipsum dolor
sit amet, consectetuer adipiscing elit. Aliquam hendrerit
mi posuere lectus.
Vestibulum enim wisi, viverra nec, fringilla in, laoreet
vitae, risus. Donec sit amet nisl. Aliquam semper ipsum
sit amet velit.
2. Suspendisse id sem consectetuer libero luctus adipiscing.This is valid for other block elements such as blockquotes:
* A list item with a blockquote:
> This is a blockquote
> inside a list item.or event other lists.
You can create nested lists by indenting list items by four spaces.
1. Item 1
1. A corollary to the above item.
2. Yet another point to consider.
2. Item 2
* A corollary that does not need to be ordered.
* This is indented four spaces
* You might want to consider making a new list.
3. Item 3To nest a third (or more) sublist level, you need to indent 4 extra spaces (or 1 extra tab) for each level.
1. level 1
1. Level 2
* Level 3
2. level 2
1. Level 3
1. Level 1
You can nest fenced codeblocks the same way you nest other block elements, by indenting by fours spaces or a tab:
1. Some code:
```js
var foo = 'bar';
console.log(foo);
```To put a indented style code block within a list item, the code block needs to be indented twice — 8 spaces or two tabs:
1. Some code:
var foo = 'bar';
console.log(foo);If you wrap a valid URL or email in <> it will be turned into a link whose text is the link itself.
link to <http://www.google.com/>
this is my email <somedude@mail.com>In the case of email addreses, Markdown will also perform a bit of randomized decimal and hex entity-encoding to help obscure your address from address-harvesting spambots.
You can disable this obfuscation setting encodeEmails option to false.
Markdown can also automagically turn every valid URL it finds in the text body to links for you, without the need to wrap them in <>.
link to http://www.google.com/
this is my email somedude@mail.comYou can create an inline link by wrapping link text in brackets ( [ ] ), and then wrapping the link in parentheses ( ( ) ).
For example, to create a hyperlink to github.com/Markdownjs/Markdown, with a link text that says, Get Markdown!, you'd write this in Markdown: [Get Markdown!](https://github.com/Markdownjs/Markdown).
You can also use the reference style, like this:
this is a [link to google][1]
[1]: www.google.comMarkdown also supports implicit link references:
this is a link to [google][]
[google]: www.google.comMarkdown uses an image syntax that is intended to resemble the syntax for links, also allowing for two styles: inline and reference.
Inline image syntax looks like this:
That is:
- An exclamation mark: !;
- followed by a set of square brackets, containing the alt attribute text for the image;
- followed by a set of parentheses, containing the URL or path to the image, and an optional title attribute enclosed in double or single quotes.
Reference-style image syntax looks like this:
![Alt text][id]Where “id” is the name of a defined image reference. Image references are defined using syntax identical to link references:
[id]: url/to/image "Optional title attribute"Implicit references are also supported in images, similar to what happens with links:
![Markdown logo][]
[Markdown logo]: http://Markdownjs.github.io/demo/img/editor.logo.white.pngYou can also define the image dimensions, like this:
or in reference style:
![Alt text][id]
[id]: url/to/image =250x250Tables aren't part of the core Markdown spec, but they are part of GFM and Markdown supports them.
| Tables | Are | Cool |
| ------------- |:-------------:| -----:|
| **col 3 is** | right-aligned | $1600 |
| col 2 is | *centered* | $12 |
| zebra stripes | ~~are neat~~ | $1 |
Colons can be used to align columns.
The outer pipes (|) are optional, matching GFM spec.
You also don't need to make the raw Markdown line up prettily.
You can also use other markdown syntax inside them.
Markdown allows you to use backslash (\) escapes to generate literal characters which would otherwise have special meaning in markdown’s syntax. For example, if you wanted to surround a word with literal underscores (instead of an HTML <em> tag), you can use backslashes before the unserscores, like this:
\_literal underscores\_Markdown provides backslash escapes for the following characters:
\ backslash
` backtick
* asterisk
_ underscore
{} curly braces
[] square brackets
() parentheses
# hash mark
+ plus sign
- minus sign (hyphen)
. dot
! exclamation mark