Where system messages are dynamically generated, sometimes you need static admonitions
for your narrative. We have made five types available.
tip-msg, note-msg, important-msg, caution-msg and
tip-msg can be used for tip and information boxes.
For information, write “Information” as the heading.
The category is for information you think might be helpful for the user, but he/she doesn’t have to react to.
Do not hit your thumb with the hammer, it hurts!
The note category is slightly more severe. It is for information the user must read even if he/she is just skimming the page. A relevant use for the note admonition is to make disclaimers. You should then use “Disclaimer” as the heading.
Using a hammer to put together your computer is bad.
"Important" is slightly stronger than "Note."
Watch where you’re swinging that hammer!
Hitting your thumb with a hammer may lead to an unwanted trip to the hospital!
Do not, under any circumstances, admit that you hit your own thumb with a hammer. The ridicule you will face is astounding!
They all follow the same template. A <div> with the correct class, a <div> for the textual type of the
admonition and a <p> for the message.
The class can be one of
tip-msg, note-msg, important-msg, caution-msg or
<div class="tip-msg"> <strong>Tip</strong> <p>Do not hit your thumb with the hammer, it hurts!</p> </div>
If you’re sure the user understands the icon, or it is obvious from the message, you can code it without a <strong> and a <p>.
You can use a list in place of the paragraph.
Document last modified 2008/02/08. Content in this portal is modified daily by a community of providers.