Jaki rezultat zostanie wyświetlony po wykonaniu przedstawionego kodu HTML?
Rys. B
Źle. Pełne kropki i liczba 4 - pominięto i zagnieżdżenie listy, i atrybut type="A".
Rys. D
Dobrze. Zagnieżdżona lista ul ma okręgi, a lista z type="A" i start="4" zaczyna od litery D.
Rys. A
Źle. Okręgi się zgadzają, ale ostatni punkt ma liczbę 4, a type="A" każe numerować literami.
Rys. C
Źle. Ostatni punkt oznaczony D się zgadza, ale lista zagnieżdżona w ol domyślnie ma puste okręgi, nie kropki.
Pytanie z egzaminu CKE, czerwiec 2019 (arkusz E.14-X-19.06).
Poprawny jest rysunek, na którym lista zagnieżdżona ma puste okręgi, a ostatni punkt oznaczono literą D. Pierwsza lista
<ol> numeruje punkty 1, 2, 3. Lista <ul> wstawiona w drugi punkt jest listą zagnieżdżoną, a przeglądarki w swoich stylach domyślnych dają liście nieuporządkowanej na drugim poziomie znacznik list-style-type: circle zamiast pełnej kropki. Druga lista <ol type="A" start="4"> numeruje literami i zaczyna od czwartej pozycji, więc jej punkt dostaje literę D. Do zapamiętania: type wybiera rodzaj numeracji (1, A, a, I, i), a start podaje numer początkowy zawsze liczbą, nawet przy literach.Ten kod ma dwie pułapki i każdy z błędnych rysunków wpada w co najmniej jedną z nich. Pierwsza dotyczy znacznika listy zagnieżdżonej: pełne kropki pojawiają się przy liście
<ul> na pierwszym poziomie, a ta lista leży wewnątrz punktu listy <ol>, więc przeglądarka rysuje puste okręgi. Druga dotyczy listy <ol type="A" start="4">. Atrybut type="A" zmienia numerację na wielkie litery, a start="4" każe zacząć od czwartej, dlatego jedyny punkt tej listy to D, a nie 4. Rysunki z liczbą 4 przy ostatnim punkcie pomijają atrybut type, a rysunek z pełnymi kropkami ignoruje zagnieżdżenie. Pasuje tylko widok z okręgami przy punktach zagnieżdżonych i literą D przy ostatnim punkcie. Wygląd znaczników można zmienić stylem, na przykład list-style-type: square, ale kod z pytania nie zawiera żadnych stylów, więc obowiązują ustawienia domyślne przeglądarki.