เลือกองค์ประกอบตามหลายคลาส

ฉันมีกฎสไตล์ฉันต้องการใช้กับแท็กเมื่อมีสองคลาส มีวิธีการดำเนินการนี้โดยไม่ใช้ JavaScript? ในคำอื่น ๆ :

<li class='left ui-class-selector'>

ฉันต้องการที่จะใช้กฎสไตล์ของฉันเท่านั้นถ้าliมีทั้ง.leftและ.ui-class-selectorเรียนนำไปใช้

คุณหมายถึงสองชั้น? "เชน" ตัวเลือก (ไม่มีช่องว่างระหว่างตัวเลือก):

.class1.class2 {
    /* style here */
}

เลือกนี้องค์ประกอบทั้งหมดที่มีว่ายังมีclass1class2

ในกรณีของคุณ:

li.left.ui-class-selector {

}

เอกสารอย่างเป็นทางการ: เตอร์ระดับ CSS2

เมื่อakamikeชี้ให้เห็นปัญหาเกี่ยวกับวิธีการนี้ใน Internet Explorer 6 คุณอาจต้องการอ่านสิ่งนี้: ใช้คลาสสองชั้นใน IE6 CSS หรือไม่

ตัวเลือกลูกโซ่ไม่ได้ จำกัด เฉพาะคลาสเท่านั้นคุณสามารถทำได้ทั้งคลาสและรหัส

การเรียนการสอน

.classA.classB {
/*style here*/
}

คลาสและรหัส

.classA#idB {
/*style here*/
}

ฉันทำ

#idA#idB {
/*style here*/
}

เบราว์เซอร์ที่ดีในปัจจุบันทั้งหมดรองรับสิ่งนี้ยกเว้น IE 6 โดยเลือกจากตัวเลือกสุดท้ายในรายการ ดังนั้น ".classA.classB" จะเลือกตามเพียงแค่ ".classB"

สำหรับกรณีของคุณ

li.left.ui-class-selector {
/*style here*/
}

หรือ

.left.ui-class-selector {
/*style here*/
}

คุณสามารถใช้วิธีแก้ไขปัญหาเหล่านี้:

กฎ CSS ใช้กับแท็กทั้งหมดที่มีสองคลาสต่อไปนี้:

.left.ui-class-selector {
    /*style here*/
}

กฎ CSS ใช้กับแท็กทั้งหมดที่มี<li>สองคลาสต่อไปนี้:

li.left.ui-class-selector {
   /*style here*/
}

โซลูชั่น jQuery:

$("li.left.ui-class-selector").css("color", "red");

โซลูชัน Javascript:

document.querySelector("li.left.ui-class-selector").style.color = "red";