Is there a difference if I put a space in CSS sele

问题:

This question already has answers here:

What does a space mean in a CSS selector? i.e. What is the difference between .classA.classB and .classA .classB? (4 answers)

Closed 5 years ago.

Is there a difference between these?

.someClass.anotherClass

.someClass .anotherClass

Does the white space make a difference. If yes, what difference does it make?

回答1:

Yes it makes a difference. Using a space is the descendant selector. In your example, anotherClass must be a descendant of someClass.

<div class="someClass">
    <div class="anotherClass"></div>
</div>

Without a space, you are targeting elements that match all classes specified. In your example, matched elements must have both someClass and anotherClass.

<div class="someClass anotherClass">
</div>

回答2:

.someClass.anotherClass will select below element

<div class="someClass anotherClass"></div>

.someClass .anotherClass (descendant selector)

<div class="someClass">
<span class="anotherClass"></span> //this will be selected
</div>

回答3:

.someClass.anotherClass will work in the case of if your class name is "someClass anotherClass", Means you have only one class including space between name.

.someClass .anotherClass It will not affect to your first class['someClass'] code if you have two different classes. Only second class with be affected.

Hope u will get the point.