Alert Boxes

You can create alert boxes of various kinds using the CSS classes admonition, warning, tip, note, seealso and todo. These are meant to be similar to Bootstrap’s alerts, Semantic UI’s messages, or the various admonitions and see also’s etc provided by reStructuredText and Sphinx.

To use an alert write a <div> with a CSS class on it, like this:

<div class="note">
This is a note.
</div>

If you want to use Markdown rather than raw HTML inside the <div> then add a markdown="1" attribute to it:

<div class="note" markdown="1">
Now I can use things like Markdown `code` and [links](example.com).
</div>

Here are all the available styles:

This is a generic admonition.

This is a warning box. Also known as an attention, caution, danger, error, or important box.

This is a tip or hint box.

This is a note.

This is a seealso.

This is a todo.

All of the alert box styles have special colors for links:

This is a generic admonition with a link in it.

This is a warning with a link in it.

This is a tip or hint with a link in it.

This is a note with a link in it.

This is a seealso with a link in it.

This is a todo with a link in it.

You can put arbitrary HTML inside alert boxes (remember your markdown="1" if using Markdown):

Todo

List item one

List item two

List item three

Aliquam eu quam blandit, condimentum velit nec, hendrerit urna.