docsify/docs/helpers.md

Doc helper

docsify extends Markdown syntax to make your documents more readable.

important content

Important content like:

> [!] **Time** is money, my friend!

is rendered as:

[!] Time is money, my friend!

General tips

General tips like:

> [?] _TODO_ unit test

are rendered as:

[?] TODO unit test

More tips

> [x] bad

> [v] good

[x] bad

[v] good

Details

> [details] Sample code
>
> js code
>
> ```javascript
> console.log("foo");
> ```

> [details:open] Sample code open
>
> js code
>
> ```javascript
> console.log("foo");
> ```

[details] Sample code

js code

console.log("foo");

[details:open] Sample code open

js code

console.log("foo");

Ignore to compile link

Some time we will put some other relative path to the link, you have to need to tell docsify you don't need to compile this link. For example

[link](/demo/)

It will be compiled to <a href="/#/demo/">link</a> and will be loaded /demo/README.md. Maybe you want to jump to /demo/index.html.

Now you can do that

[link](/demo/ ":ignore")

You will get <a href="/demo/">link</a>html. Do not worry, you can still set title for link.

[link](/demo/ ":ignore title")

<a href="/demo/" title="title">link</a>

Set target attribute for link

[link](/demo ":target=_blank")
[link](/demo2 ":target=_self")

Disable link

[link](/demo ":disabled")

Github Task Lists

- [ ] foo
- bar
- [x] baz
- [] bam <~ not working
  - [ ] bim
  - [ ] lim

• foo
• bar
• baz
• [] bam <~ not working
  • bim
  • lim

Image resizing

![logo](https://docsify.js.org/_media/icon.svg ":size=50x100")
![logo](https://docsify.js.org/_media/icon.svg ":size=100")

<!-- Support percentage -->

![logo](https://docsify.js.org/_media/icon.svg ":size=10%")

Customise ID for headings

### 你好，世界！ :id=hello-world

Markdown in html tag

You need to insert a space between the html and markdown content. This is useful for rendering markdown content in the details element.

<details>
<summary>Self-assessment (Click to expand)</summary>

- Abc
- Abc

</details>

Self-assessment (Click to expand)

• Abc
• Abc

Or markdown content can be wrapped in html tag.

<div style='color: red'>

- listitem
- listitem
- listitem

</div>

• Abc
• Abc