Docsify Markdown Extensions
Docsify provides some useful extensions to markdown. Some examples are shown below.
Content highlighting
Use ?> and !> before text to highlight blocks of content:
?> This is highlighted
!> And so am IThis is highlighted
And so am I
Image resizing
Set target attribute for link
[link](/example ':target=_blank')
[link](/example2 ':target=_self')Disabled Link
[link](/demo ':disabled')HTML
Some useful HTML elements are available for adding default interactivity and illustrations.
Details/summary for dropdown content
<hr />
<details>
<summary>Click me to expand!</summary>
I can contain markdown content too. Just leave a newline between markdown and HTML elements.
- Abc
- Def
</details>
<hr />Click me to expand!
I can contain markdown content too. Just leave a newline between markdown and HTML elements.
- Abc
- Def
Progress/meter bars
<progress value="70" max="100"></progress>
<meter
min="0" max="100"
low="33" high="66" optimum="80"
value="50">
Current value: 50/100
</meter>Markdown Syntax
# h1 Heading
## h2 Heading
### h3 Heading
#### h4 Heading
##### h5 Heading
###### h6 Heading
h1 Heading
h2 Heading
h3 Heading
h4 Heading
h5 Heading
h6 Heading
Horizontal Rules
---
---
---Emphasis
**This is bold text**
**This is bold text**
_This is italic text_
_This is italic text_
~~Strikethrough~~This is bold text
This is bold text
This is italic text
This is italic text
Strikethrough
Blockquotes
> Blockquotes can also be nested...
>
> > ...by using additional greater-than signs right next to each other...
> >
> > > ...or with spaces between arrows.Blockquotes can also be nested…
…by using additional greater-than signs right next to each other…
…or with spaces between arrows.
Lists
Unordered
- Create a list by starting a line with `+`, `-`, or `*`
- Sub-lists are made by indenting 2 spaces:
- Marker character change forces new list start:
- Ac tristique libero volutpat at
* Facilisis in pretium nisl aliquet
- Nulla volutpat aliquam velit
- Very easy!- Create a list by starting a line with
+,-, or* - Sub-lists are made by indenting 2 spaces:
- Marker character change forces new list start:
- Ac tristique libero volutpat at
- Facilisis in pretium nisl aliquet
- Nulla volutpat aliquam velit
- Marker character change forces new list start:
- Very easy!
Ordered
1. Lorem ipsum dolor sit amet
2. Consectetur adipiscing elit
3. Integer molestie lorem at massa
It’s important to note that the actual numbers you use to mark the list have no effect on the HTML output Markdown produces.
1. You can use sequential numbers...
1. ...or...
1. keep all the numbers as `1.`
Start numbering with offset:
57. foo
1. bar- Lorem ipsum dolor sit amet
- Consectetur adipiscing elit
- Integer molestie lorem at massa
It’s important to note that the actual numbers you use to mark the list have no effect on the HTML output Markdown produces.
- You can use sequential numbers…
- …or…
- keep all the numbers as
1.
Start numbering with offset:
- foo
- bar
Code
Use the back tick character (`) to display code.
Inline code
The follow text is `inline code`.The follow text is inline code.
Block code “fences”
```
No language indicated, so no syntax highlighting in Markdown Here.
But let's throw in a <b>tag</b>.
```No language indicated, so no syntax highlighting in Markdown Here.
But let's throw in a <b>tag</b>.Syntax highlighting
```javascript
var foo = function(bar) {
return bar++;
};
console.log(foo(5));
```var foo = function(bar) {
return bar++;
};
console.log(foo(5));```python
s = "Python syntax highlighting"
print s
```s = "Python syntax highlighting"
print sIndented code
// Some comments
line 1 of code
line 2 of code
line 3 of code// Some comments
line 1 of code
line 2 of code
line 3 of codeTables
| Option | Description |
| ------ | ------------------------------------------------------------------------- |
| data | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext | extension to be used for dest files. |
Right aligned columns
| Option | Description |
| -----: | ------------------------------------------------------------------------: |
| data | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext | extension to be used for dest files. || Option | Description |
|---|---|
| data | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext | extension to be used for dest files. |
Right aligned columns
| Option | Description |
|---|---|
| data | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext | extension to be used for dest files. |
Link and Links
[link text](http://dev.nodeca.com)
[link with title](http://nodeca.github.io/pica/demo/ "title text!")
Autoconverted link https://github.com/nodeca/pica (enable linkify to see)Autoconverted link https://github.com/nodeca/pica (enable linkify to see)
Image and Images
Like links, Images also have a footnote style syntax
![Alt text][id]
With a reference later in the document defining the URL location:
[id]: https://octodex.github.com/images/dojocat.jpg ":size=400 The Dojocat"
Like links, Images also have a footnote style syntax
With a reference later in the document defining the URL location:
