दो टैग के लिए एक सीएसएस नियम कैसे सेट करें?

Question

मैं जानना चाहता हूं कि मैं दो अलग-अलग वर्गों के लिए एक सेटिंग कैसे सेट कर सकता हूं।

एक उदाहरण देना करने के लिए:

.footer #one .flag li .drop_down form div{ 
    width: 80px; 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 11px; 
    text-align: left; 
    line-height: 1.5; 
    color: #ccc; 
    font-weight:bolder; 
    margin-left: 30px; 
} 
.footer #two .flag li .drop_down form div{ 
    width: 80px; 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 11px; 
    text-align: left; 
    line-height: 1.5; 
    color: #ccc; 
    font-weight:bolder; 
    margin-left: 30px; 
} 

दोनों नियम एक ही सामग्री है। अंतर सिर्फ दूसरा टैग है। क्या ऐसा कुछ करने का कोई तरीका है?

.footer >>>#one and #two<<<< .flag li .drop_down form div{ 
     width: 80px; 
     font-family: Arial, Helvetica, sans-serif; 
     font-size: 11px; 
     text-align: left; 
     line-height: 1.5; 
     color: #ccc; 
     font-weight:bolder; 
     margin-left: 30px; 
    } 

Answer 1

कॉमा से अलग चयनकर्ताओं:

.footer #one .flag li .drop_down form div, 
.footer #two .flag li .drop_down form div { 
    /* Rules */ 
} 

selectors level 3 spec से:

चयनकर्ताओं की अल्पविराम द्वारा अलग की गई सूची व्यक्ति में से प्रत्येक के द्वारा चयनित सभी तत्वों के मिलन का प्रतिनिधित्व करता है सूची में चयनकर्ताओं। (एक कॉमा यू + 002C है।) उदाहरण के लिए, सीएसएस में जब कई चयनकर्ता एक ही घोषणा साझा करते हैं, तो उन्हें अल्पविराम से अलग सूची में समूहीकृत किया जा सकता है। व्हाइट स्पेस पहले और/या कॉमा के बाद दिखाई दे सकता है।

Answer 2

.footer #one .flag li .drop_down form div, 
.footer #two .flag li .drop_down form div{ 
    ... 
} 

Answer 3

सीएसएस में आप एक , (अल्पविराम) का उपयोग करें, दुर्भाग्य से इस बस का एक वर्ग के बजाय पूरे चयनकर्ता पर है।

यदि आप वास्तव में इसे क्लीनर बनाना चाहते हैं तो आप form div's प्रत्येक अद्वितीय आईडी और फिर #form1, #form2 दे सकते हैं।

आप "Shorten the comma separated CSS selectors" में और जानकारी प्राप्त कर सकते हैं।

उदाहरण के लिए:

.footer #one .flag li .drop_down form div, 
.footer #two .flag li .drop_down form div { 
    width: 80px; 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 11px; 
    text-align: left; 
    line-height: 1.5; 
    color: #ccc; 
    font-weight:bolder; 
    margin-left: 30px; 
} 

Answer 4

कॉमा से अलग करें:

.footer #one .flag li .drop_down form div, 
.footer #two .flag li .drop_down form div 
{ 
shared css 
} 

.footer #one .flag li .drop_down form div 
{ 
indvi css for one 
} 

.footer #two .flag li .drop_down form div 
{ 
indvi css for two 
} 

Answer 5

अलग सीएसएस नियम के बजाय एक अल्पविराम का उपयोग करें:

.footer #one .flag li .drop_down form div, 
.footer #two .flag li .drop_down form div { 
    width: 80px; 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 11px; 
    text-align: left; 
    line-height: 1.5; 
    color: #ccc; 
    font-weight:bolder; 
    margin-left: 30px; 
} 

Answer 6

अन्य लोगों के रूप में करने के लिए इस सवाल का जवाब कहते हैं आपका प्रश्न है:

.footer #one .flag li .drop_down form div, 
.footer #two .flag li .drop_down form div { 
    /* Rules */ 
} 

लेकिन क्योंकि एक आईडी अपने पेज में अद्वितीय माना जाता है, अपने कोड इस तरह सरल किया जा सकता है:

#one .flag li .drop_down form div, 
#two .flag li .drop_down form div { 
    /* Rules */ 
}