niedziela, 27 marca 2022

Liczniki w CSS

Jedn膮 z rzeczy kt贸rych najbardziej nie lubi臋 podczas pisania d艂u偶szych tekst贸w, jest dbanie o prawid艂ow膮 struktur臋 danych. R臋czne przypisywanie numer贸w do poszczeg贸lnych nag艂贸wk贸w jest z艂膮 praktyk膮, kt贸ra wychodzi na jaw przy zmianach struktury dokumentu. W Markdown na razie nie ma na to rozwi膮zania, natomiast CSS oferuje bardzo przydatne liczniki, czyli counters. 

Liczniki w CSS pozwalaj膮 na stworzenie list numerowanych element贸w, daj膮c znacznie wi臋ksze mo偶liwo艣ci ni偶 zwyk艂e listy numerowane. Dzi臋ki nim mo偶esz na przyk艂ad utworzy膰 numeracj臋 nag艂贸wk贸w o kilku stopniach zagnie偶d偶enia, tworz膮c struktur臋 na艣laduj膮c膮 dobrze sformatowan膮 ksi膮偶k臋.

Counters 艣wietnie sprawdz膮 si臋 przy wy艣wietlaniu hierarchicznych danych. W za艂膮czonym przyk艂adzie przedstawiam dzia艂anie licznik贸w.

See the Pen css counters by Kamil (@KamilNaja) on CodePen.