Content
Text and titles live in main, organised with sections
and headings. The hierarchy is the markup — and the spacing follows it automatically.
Sections & headings
One h1 names the page; each section
opens with the next heading down (h2, then h3…). Nesting
a section indents it under a hairline rule and tightens its spacing.
Live — each heading sits in its own nested section:
A top-level section
Body text belonging to this section. Siblings sit a full step apart.
A subsection
One level deeper: indented, contents drawn closer.
A sub-subsection
Deeper still — the spacing tightens again, with no classes.
Text
A paragraph with a link, some strong and
emphasised words, and small print. Inline
code sits in the flow.
- Unordered one
- Unordered two
- Unordered three
- Ordered one
- Ordered two
- Ordered three
Make the simple things simple, and the complex things possible.
function greet(name) {
return `Hello, ${name}!`;
}