Dongfeng Gu
[Reference] Markdown Common Elements
- 3 minsSummary:
You can pick as item to see how to apply in markdown.
Comum Elements
Basic formatting
This note demonstrates some of what Markdown is capable of doing.
And that’s how to do it.
This note **demonstrates** some of what [Markdown][some/link] is *capable of doing*.Headings
There are six levels of headings. They correspond with the six levels of HTML headings. You’ve probably noticed them already in the page. Each level down uses one more hash character. But we are using just 4 of them.
Headings can be small
Headings can be small
Headings can be small
Headings can be small
# Heading
## Heading
### Heading
#### HeadingLists
Ordered list
- Item 1
- A second item
- Number 3
1. Item 1
2. A second item
3. Number 3Unordered list
- An item
- Another item
- Yet another item
- And there’s more…
* An item
* Another item
* Yet another item
* And there's more...Paragraph modifiers
Quote
Here is a quote. What this is should be self explanatory. Quotes are automatically indented when they are used.
> Here is a quote. What this is should be self explanatory.URLs
URLs can be made in a handful of ways:
- A named link to Mark It Down.
- Another named link to Mark It Down
- Sometimes you just want a URL like http://markitdown.net/.
* A named link to [MarkItDown][3].
* Another named link to [MarkItDown](http://markitdown.net/)
* Sometimes you just want a URL like <http://markitdown.net/>.Horizontal rule
A horizontal rule is a line that goes across the middle of the page. It’s sometimes handy for breaking things up.
---Images
Markdown can also contain images. I’ll need to add something here sometime.
![Markdowm Image][/image/url]
Figure Caption?
![Markdowm Image][/image/url]
<figcaption class="caption">Photo by John Doe</figcaption>
Bigger Images?
![Markdowm Image][/image/url]{: class="bigger-image" }
Code
A HTML Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<h1>Just a test</h1>
</body>
</html>A CSS Example:
pre {
padding: 10px;
font-size: .8em;
white-space: pre;
}
pre, table {
width: 100%;
}
code, pre, tt {
font-family: Monaco, Consolas, Inconsolata, monospace, sans-serif;
background: rgba(0,0,0,.05);
}A JS Example:
// Sticky Header
$(window).scroll(function() {
if ($(window).scrollTop() > 900 && !$("body").hasClass('show-menu')) {
$('#hamburguer__open').fadeOut('fast');
} else if (!$("body").hasClass('show-menu')) {
$('#hamburguer__open').fadeIn('fast');
}
});