Cosa significano i doppi due punti (: :) in CSS?

Cosa significano i doppi due punti ( ::) nei CSS?

Per esempio:

input[type=text]::-ms-clear { display: none; }

Significa selettore di pseudo elementi . Significa che l' elemento a destra non esiste nel DOM normale, ma può essere selezionato.

Uno pseudoelemento è composto da due due punti (: :) seguiti dal nome dello pseudoelemento.

fonte

In origine era solo un singolo due punti, ma è stato cambiato per differenziarla dalla pseudo classi (come :hover, :first-child, :notecc). È meglio usare :per beforee afterpseudo elementi poiché i due punti singoli hanno un migliore supporto del browser, in particolare nelle versioni precedenti di IE.

L' ::operatore indica che stai selezionando uno pseudo elemento , uno che in realtà non esiste come elemento ma può ancora essere scelto come destinazione per lo stile.

Un esempio di questo include diverse implementazioni specifiche del fornitore come l' -ms-clearesempio fornito, la maggior parte dei browser ha anche pseudo elementi per definire lo stile delle barre di scorrimento e altri elementi nativi dell'interfaccia utente, ma ci sono anche molti pseudo elementi predefiniti a cui è possibile fare riferimento per motivi pratici, come first-linee first-letter.

Gli :beforee :afterpseudo elementi consentono anche di inserire effettivo contenuto nella pagina utilizzando CSS con la contentregola.

CSS3 cambia il modo in cui vengono selezionati gli pseudo-elementi, poiché il W3C voleva distinguere le pseudo-classi come a:visitedda pseudo-elementi come p::first-line. Vedere Selettori CSS avanzati .