การเลือกองค์ประกอบโดยใช้หลายคลาสใน CSS

หากต้องการ เราสามารถเลือกองค์ประกอบที่มี สองคลาสพร้อมกัน โดยไม่กระทบต่อองค์ประกอบ ที่มีคลาสเดียวใดคลาสหนึ่ง

ลองดูตัวอย่าง สมมติว่าเรามีโค้ดต่อไปนี้:

<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 ส่วนย่อหน้าที่สาม มีทั้งสองคลาสพร้อมกัน

มาเลือกย่อหน้าสุดท้ายกัน โดยไม่กระทบ ส่วนที่เหลือ ในการทำเช่นนี้ ให้เขียนชื่อคลาสหนึ่ง และชื่อคลาสที่สองต่อกันโดยไม่มีช่องว่าง:

.eee.zzz {
	color: red;
}

เลือกองค์ประกอบที่มีคลาส eee, zzz และ ccc พร้อมกัน:

<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>