Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS "::" meaning [duplicate]

I'm seeing this usage a lot. Specially with the pseudo classes. What does "::" means in CSS?

.a_demo_three::before {
like image 837
Mia Avatar asked Feb 06 '13 02:02

Mia


People also ask

Why :: is used in CSS?

Syntax. Note: CSS introduced the ::after notation (with two colons) to distinguish pseudo-classes from pseudo-elements. For backward compatibility, browsers also accept :after , introduced earlier.

How do you duplicate an element in CSS?

First, hover over the element you want to copy. Then, right-click on it and choose the option “Inspect”. On the left side is the HTML DOM tree, and on the right side, the CSS styles of the selected element. Having the right element selected on the HTML DOM tree, right-click on it and choose “Copy” > “Copy styles”.

How do you duplicate in HTML?

From the HTML provided, start copying the HTML with the first table tag so you include the necessary content. Copy all the way through to the end table tag. Use the Control + C shortcut to copy or right click on your selected text and click Copy. Create a new page in your Site.

What is dry CSS?

The DRY principle states that there should be only one copy of important information. Cascading style sheets control the appearance of HTML documents. By having separate HTML and CSS files, it is easy and efficient to have several different HTML documents with the same general appearance.


1 Answers

From the MDN:

Sometimes you will see double colons (::) instead of just one (:). This is part of CSS3 and an attempt to distinguish between pseudo-classes and pseudo-elements. Most browsers support both values.

So, when you want to use pseudo-classes like :hover, :first-child etc, use a single colon. If you want to use pseudo-elements, like ::before, ::after, ::first-letter and so on, use double colons.


One more note: the W3C states that browsers should only accept the :: notation for pseudo-elements introduced in CSS 3, so you should follow the recommendations above :)

like image 200
nice ass Avatar answered Sep 18 '22 06:09

nice ass