MoreLesson 193Free preview

Notes

This lesson is part of How To · All levels

Summary

Notes or notebooks are used to display additional information supporting the main text, such as technical details or reminders. It looks like a callout, but it's usually calmer and less urgent. With a left border, a young background, and enough padding, notes are easily recognizable without interfering with the reading process.

Key points

Use semantic structures like sides or div with clear headings
Give the inside distance with padding and the outside distance with margin so as not to stick
The color of the border and the background can distinguish between the type of note
Avoid taking notes that are too long; keep them concise to be easy to scan

Full lesson

Code examples and quizzes

Full lessons, code examples, and quizzes are available to subscribers. 5 questions.