Dlaczego są tu dwa dwukropki? rozpiętość :: przed

Question

Jest to pełna linia kodu Patrzę, a tu jest jego kontekst: http://acidmartin.wordpress.com/2011/02/24/custom-crossbrowser-styling-for-checkboxes-and-radio-buttons

input[type="radio"] + span::before { content: ""; display: inline-block; width: 20px; height: 20px; background: url("sprite.png") no-repeat -20px 0; vertical-align: middle; } 

mam przyzwoity zrozumienia jak to działa, ale nie rozumiem, dlaczego istnieją dwa dwukropki, a nie jeden między rozpiętością a wcześniejszym.

Przed selektorem, z tego, co przeczytałem, należy użyć jednego dwukropka.

http://www.w3schools.com/cssref/sel_before.asp

Na W3C, nie mogę znaleźć żadnych selektorów, które mają dwa dwukropki, nie mogę zrozumieć, dlaczego miałby rozpiętość dwukropek po nim, oprócz okrężnicy poprzedzającego „przed”.

http://www.w3.org/TR/CSS2/selector.html

Answer 1

To Pseudoelement, określone przez CSS Selectors Level 3 specyfikacji:

W ::before i ::after pseudoelementy może być użyta do określenia generowany zawartość przed lub po zawartości danego elementu .

Jest faktycznie taki sam, jak składnia pojedynczych znaków zdefiniowana w specyfikacji poziomu 2. Specyfikacja poziomu 3 wprowadza dodatkowy dwukropek, aby odróżnić pseudoelementy od pseudoklas (które używają pojedynczego dwukropka).

Obie składnie będą działać w nowszych przeglądarkach, ale starsze przeglądarki nie rozpoznają nowego stylu ::.

---

Dla jeszcze bardziej szczegółowo, można spojrzeć na grammar z poziomu 3 specyfikacji, który stanowi:

'::' rozpoczyna pseudo-element, ':' pseudo-klasę

Answer 2

można przeczytać artykuł o tym here

Ale w zasadzie to jest rozróżnienie między klasami i elementami pseudo pseudo. Jest to standard css3 do używania dwukropka dla pseudoelementu, jako przeciwstawiającego się standardowi CSS2 tylko jednego.

Jeden lub dwa dwukropki będzie działać jako przeglądarek chcą, aby zaspokoić zarówno CSS2 i CSS3