ელემენტის არჩევა რამდენიმე კლასით CSS-ში

სურვილის შემთხვევაში ჩვენ შეგვიძლია ავირჩიოთ ელემენტი, რომელსაც ერთდროულად ორი კლასი აქვს, ელემენტების გავლების გარეშე რომლებსაც აქვთ ამ კლასებიდან მხოლოდ ერთ-ერთი.

მოდით შევხედოთ მაგალითს. დავუშვათ, რომ ჩვენ გვაქვს შემდეგი კოდი:

html<p class="eee">
  This is a paragraph with text.
</p>
<p class="zzz">
  This is a paragraph with text.
</p>
<p class="eee zzz">
  This is a paragraph with text.
</p>

როგორც ხედავთ, პირველ აბზაცს აქვს კლასი eee, მეორე აბზაცს - კლასი zzz, ხოლო მესამე აბზაცს - ერთდროულად ორივე ეს კლასი.

მოდით ავირჩიოთ ბოლო აბზაცი, სხვების გავლების გარეშე. ამისათვის ჩავწეროთ ერთი კლასის სახელი და მეორე კლასის სახელი შეჯგუფებულად, სივრცეების გარეშე:

css.eee.zzz {
  color: red;
}

html<p class="eee">
  This is a paragraph with text.
</p>
<p class="zzz">
  This is a paragraph with text.
</p>
<p class="ccc">
  This is a paragraph with text.
</p>
<p class="eee zzz ccc">
  This is a paragraph with text.
</p>