Nadpis první úrovně (H1)

Toto je ukázkový odstavec s delším textem, který slouží k ověření základní typografie těla stránky. Dobrý odstavec má správný řádkový proklad, vhodnou šířku sloupce pro pohodlné čtení a dostatečné odsazení od sousedních prvků. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Druhý odstavec demonstruje mezery mezi odstavci. Text může obsahovat tučný text, kurzívu, tučnou kurzívu, podtržení, přeškrtnutý text nebo zvýraznění. Inline kód vypadá takto: console.log("hello"). A tady je ukázkový odkaz.

Odstavec může také obsahovat ^{horní index} a _{dolní index}, nebo zmenšený text pro poznámky a výhrady.

Nadpis druhé úrovně (H2)

Pod H2 pokračuje text. Druhá úroveň nadpisu obvykle označuje hlavní sekce stránky nebo článku. Hierarchie nadpisů by měla být vizuálně čitelná na první pohled.

Nadpis třetí úrovně (H3)

H3 slouží jako podnadpis uvnitř sekcí. Měl by být zřetelně odlišený od H2, ale stále výrazný vůči textu odstavce.

Nadpis čtvrté úrovně (H4)

H4 se používá pro jemnější členění. V praxi se nasazuje méně často – ověř, zda je stále dobře čitelný.

Nadpis páté úrovně (H5)

H5 je zpravidla téměř stejně velký jako tělo textu, nebo mírně větší.

Nadpis šesté úrovně (H6)

H6 bývá nejmenší nadpis, někdy menší než základní text. Zkontroluj, zda je stále rozeznatelný.

Seznamy

Nečíslovaný seznam (ul)

• První položka seznamu
• Druhá položka s delším textem, který může přetéct na více řádků a ověří zarovnání odrážky vůči textu
• Třetí položka
  • Vnořená položka první úrovně
  • Vnořená položka druhé úrovně
    • Třetí úroveň vnoření
• Čtvrtá položka za vnořeným seznamem

Číslovaný seznam (ol)

1. První krok
2. Druhý krok s delším popisem procesu, který se může zalomit přes více řádků
3. Třetí krok
   1. Podkrok A
   2. Podkrok B
4. Čtvrtý krok následující za vnořeným seznamem
5. Pátý krok

Definičný seznam (dl)

Definovaný výraz

Popis nebo vysvětlení výrazu. Může být delší a zalomit se na více řádků.

Druhý výraz

Jeho definice.

Výraz se dvěma definicemi

První definice.

Druhá definice (alternativní nebo doplňující).

Citace a bloky

Bloková citace (blockquote)

Dobrý design je co nejméně design. Méně, ale lépe – protože se soustředí na to podstatné a produkty nejsou zatíženy nepodstatnými věcmi.

— Dieter Rams

Víceodstavcový blockquote

První odstavec citace. Dlouhé citace mohou obsahovat více odstavců a testují, jak se blokový element chová s vnitřním textem.

Druhý odstavec téže citace. Všimni si mezer mezi odstavci uvnitř citace.

— Neznámý autor

Horizontální oddělovač

Text před oddělovačem.

Text po oddělovači. Ověř tloušťku, barvu a svislé odsazení čáry.

Obrázky a média

Obrázek s popiskem (figure + figcaption)

Popisek obrázku.