O que os dois pontos duplos (: :) significam em CSS?

O que significa dois pontos duplos ( ::) em CSS?

Por exemplo:

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

Significa elemento pseudo selector. Isso significa que o elemento à direita não existe no DOM normal, mas pode ser selecionado.

Um pseudoelemento é formado por dois pontos (: :) seguidos do nome do pseudoelemento.

Fonte

Foi originalmente apenas um único cólon, mas foi alterado para diferenciá-lo de pseudo classes (como :hover, :first-child, :notetc.). É melhor usar elementos :para beforee afterpseudo, uma vez que os dois pontos simples oferecem melhor suporte ao navegador, principalmente em versões anteriores do IE.

O ::operador indica que você está selecionando um pseudoelemento , que não existe realmente como um elemento, mas ainda pode ser direcionado para estilo.

Exemplo disso inclui várias implementações específicas do fornecedor, como o -ms-clearexemplo que você fornece, a maioria dos navegadores também tem pseudo elementos para estilizar barras de rolagem e outros elementos de IU nativos, mas também há muitos pseudo elementos predefinidos que podem ser referenciados por razões práticas, como first-linee first-letter.

Os :beforee :afterpseudo elementos ainda permitem que você inserir conteúdo real na página usando CSS com a contentregra.

CSS3 muda a forma como os pseudo-elementos são selecionados, pois o W3C queria distinguir pseudo-classes a:visitedde pseudo-elementos como p::first-line. Consulte Seletores CSS avançados .