CSS ::before, el tudná ezt magyarázni nekem valaki?

a HTML kódban szimplán egy lista van, ami további listákból áll, így néz ki a végén:

1

1.1

1.2

1.2.1

1.2.2

1.3

2

2.1

stb.

CSS:

ol {

counter-reset: item;

list-style: none;

}

li:before {

content: counters(item, ".");

counter-increment: item

}

nem értem, hogy a CSS kód pontosan mit csinál, valaki segítene benne?