Do której właściwości CSS można przypisać wartości disc, circle, square, decimal?
A. list-style-type
B. text-transform
C. display
D. position
Właściwość CSS, do której przypisuje się wartości disc, circle, square oraz decimal, to list-style-type. Służy ona do określania wyglądu znacznika listy, czyli tego małego symbolu albo numeru widocznego przy elementach li. Dla list nieuporządkowanych ul typowe wartości to disc, circle i square, czyli pełne kółko, puste kółko oraz kwadrat. Dla list uporządkowanych ol często używa się decimal, czyli zwykłej numeracji 1, 2, 3. Przykład praktyczny: ul { list-style-type: square; } zmieni punktory listy na kwadraty, a ol { list-style-type: decimal; } ustawi standardowe numerowanie. Z mojego doświadczenia to jedna z tych właściwości, które często pojawiają się przy stylowaniu menu, list cech produktu albo instrukcji krok po kroku. Dobra praktyka jest taka, żeby nie usuwać znaczników list tylko dlatego, że wyglądają domyślnie brzydko. Lepiej zachować semantyczne znaczniki ul, ol i li, a wygląd kontrolować CSS-em. Dzięki temu strona jest czytelniejsza dla przeglądarek, wyszukiwarek i technologii wspomagających, np. czytników ekranu.
Warto tu rozdzielić kilka różnych obszarów CSS, bo pomyłka zwykle bierze się z tego, że wszystkie te właściwości jakoś wpływają na wygląd elementu na stronie. display odpowiada za sposób generowania pudełka elementu w układzie strony, na przykład block, inline, flex, grid albo none. To jest bardzo ważne przy budowaniu layoutu, ale nie ustawia rodzaju punktora listy. Jeśli ktoś wybiera display, to najczęściej myśli ogólnie: skoro lista się wyświetla, to pewnie tu zmienia się jej styl. No właśnie nie, display mówi raczej jak element uczestniczy w układzie dokumentu. position dotyczy pozycjonowania, czyli wartości takich jak static, relative, absolute, fixed czy sticky. Ta właściwość decyduje, czy element można przesunąć względem normalnego miejsca, rodzica albo okna przeglądarki. Nie ma związku z numeracją ani symbolami przy li. text-transform z kolei służy do zmiany wielkości liter w tekście, np. uppercase, lowercase albo capitalize. Może zmienić napis w elemencie listy, ale nie sam znacznik listy. Poprawnym tropem jest list-style-type, bo w standardowym modelu CSS właściwości z grupy list-style są przeznaczone dokładnie do formatowania list. Moim zdaniem najłatwiej to zapamiętać tak: wygląd punktora lub numeru to list-style-type, układ elementu to display, jego położenie to position, a wielkość liter to text-transform. To proste rozróżnienie mocno pomaga przy pisaniu czystego i przewidywalnego CSS-a.