CODEWITHSUNDEEP
csssyntax
Ariel Noname
Ariel Noname

Reputation: 31

CSS Syntax Difference

What's the difference between this two statements?

a.class { color: red; }

and

.class a { color: red; }

I think that with the second example one would go "inside" classes like

.class .class2 a { color: orange; }

But you couldn't do that with the first example

Upvotes: 0

Views: 93

Answers (3)

Subtlebot
Subtlebot

Reputation: 322

a.class {color: red} will color any anchor tag with the class .class red. It will only affect anchor tags with that specified class because there is no space separating the a and .class elements.

.class a { color: red; } will color any anchor tags within a parent .class element red. The space between the elements declares hierarchy this time, requiring the achor tag to be within the .class element.

Upvotes: 0

andrewb
andrewb

Reputation: 3095

With the first, all <a>'s with a class of class would be styled as per the style.

With the second, all <a>'s within an element with a class of class would be styled as per the style.

Upvotes: 0

Mr. Alien
Mr. Alien

Reputation: 157334

a.class will select a element having class .class and .class a will select ALL a elements inside an element having class .class.

About this .class .class2 a { color: orange; }

It will select ALL a elements inside an element having class .class2 which is further nested in an element having class .class

Upvotes: 3

Related Questions