Markdown Common Elements

- 3 mins ## Summary: You can pick as item to see how to apply in markdown. ### Comum Elements - [Basic formatting](#basic-formatting) - [Headings](#headings) - [Lists](#lists) - [Paragraph Modifiers](#paragraph-modifiers) - [Urls](#urls) - [Horizontal Rule](#horizontal-rule) - [Images](#images) - [Code](#code) --- ## Basic formatting This note **demonstrates** some of what [Markdown][1] 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
#### Heading
--- ## Lists ### Ordered list 1. Item 1 2. A second item 3. Number 3
1. Item 1
2. A second item
3. Number 3
### Unordered 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][3]. * Another named link to [Mark It Down](http://markitdown.net/) * Sometimes you just want a URL like .
* 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]
![Markdowm Image][6] *Figure Caption*?
![Markdowm Image][/image/url]
<figcaption class="caption">Photo by John Doe</figcaption>
![Markdowm Image][6]
Photo by John Doe
*Bigger Images*?
![Markdowm Image][/image/url]{: class="bigger-image" }
![Markdowm Image][6]{: 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');
    }

});
[1]: http://daringfireball.net/projects/markdown/ [2]: http://www.fileformat.info/info/unicode/char/2163/index.htm [3]: http://www.markitdown.net/ [4]: http://daringfireball.net/projects/markdown/basics [5]: http://daringfireball.net/projects/markdown/syntax [6]: http://kune.fr/wp-content/uploads/2013/10/ghost-blog.jpg
rss facebook twitter github youtube mail spotify lastfm instagram linkedin google google-plus pinterest medium vimeo stackoverflow reddit quora quora