Question

I was looking at a code made by a guy in twitter and it is like this :

div::after {
-webkit-transform: rotate(2deg);
}

div ~ div {
-webkit-transform: rotate(0deg);
}

what is it ?

Answer 1

The tilde character (~) is the siblings selector

h2 ~ p { color:red; }

for example would make the paragraphs red in the below code

<h2>Heading</h2>
<p>The selector above matches this paragraph.</p>
<p>The selector above matches this paragraph.</p>

the :: is used for ::before and ::after pseudo-elements which together with the content: allow you to put, for example, an icon before every link

a::before { content:url(link.png); }