W języku HTML, aby uzyskać następujący efekt formatowania
pogrubiony pochylony lub w górnym indeksie
należy zapisać kod:
<i>pogrubiony <b>pochylony lub w </i><sup>górnym indeksie</sup>
<i>, więc byłby pochylony, a <b> nie ma zamknięcia i pogrubiłoby dalszą część.<i>pogrubiony </i><b>pochylony </b>lub w <sub>górnym indeksie</sub>
<sub> daje indeks dolny.<b>pogrubiony <i>pochylony</i></b> lub w <sub>górnym indeksie</sub>
<b>, więc byłoby też pogrubione, a <sub> to indeks dolny.<b>pogrubiony </b><i>pochylony</i> lub w <sup>górnym indeksie</sup>
<b> dla pogrubienia, <i> dla pochylenia i <sup> dla indeksu górnego.Pytanie z egzaminu CKE, czerwiec 2016 (arkusz E.14-X-16.05).
Każdy fragment tekstu wymaga własnej pary znaczników. <b> pogrubia tekst, <i> go pochyla, a <sup> podnosi do górnego indeksu, jak w zapisie m². Poprawny kod zamyka </b> zaraz po słowie „pogrubiony”, dlatego „pochylony” jest już tylko pochylony.
Przy takich zadaniach czytaj kod znacznik po znaczniku i sprawdź, gdzie każdy się zaczyna i kończy. Znacznik otwarty później zamyka się wcześniej, czyli <b><i>tekst</i></b>, a nie na krzyż. W nowoczesnym HTML zamiast <b> i <i> częściej stosuje się <strong> i <em>, które oprócz wyglądu niosą znaczenie, ważne np. dla czytników ekranu.
Tu nie wystarczy zobaczyć, że w kodzie są właściwe znaczniki. Trzeba sprawdzić, który fragment tekstu obejmują. Kod zaczynający się od <i> pochyla już słowo „pogrubiony”, a <b> otwarte w środku i niezamknięte pogrubiłoby resztę wiersza.
Indeks górny i dolny łatwo pomylić. <sub> to subscript, indeks dolny, jak w H₂O. Górny indeks daje <sup>, czyli superscript. Dlatego zapis z <sub> nie da efektu z przykładu, nawet jeśli pogrubienie i pochylenie byłyby ustawione dobrze.
Kod, w którym <i>pochylony</i> stoi wewnątrz <b>, sprawia, że słowo „pochylony” jest jednocześnie pogrubione i pochylone. W przykładzie jest tylko pochylone, więc i ten zapis odpada.
Przy takich zadaniach dobrze jest narysować sobie, gdzie każdy znacznik się otwiera i zamyka. Wtedy od razu widać, które słowa obejmuje.