2012-12-04 12 views
8

मेरे पास div बॉक्स हैं। प्रत्येक दूसरे बॉक्स में एक और रंग में सीमा होनी चाहिए।एक सूची में प्रत्येक दूसरे div के लिए सीएसएस स्टाइल

एक मामले में div एस एक सूची के रूप में दिखाई देता है। मैं HTML कोड नहीं बदल सकता क्योंकि यह स्वचालित रूप से जेनरेट होता है। मेरी वेबसाइट के अन्य भागों पर मैं इस तरह स्टाइल करते हैं और यह काम करता है:

.displayBlogpost:nth-child(2n+1) { 
    border: #B4C556 1px solid; 
} 

लेकिन ol साथ कि अब और काम नहीं करता। मुझे नहीं पता कि प्रत्येक दूसरे .displayBlogpost-div तक पहुंच कैसे प्राप्त करें। यह मेरा कोड है: http://jsfiddle.net/8SbbL/

+0

की तुलना में अच्छी तरह से पढ़ता है सूची गतिशील रूप से जेनरेट की गई है (और somethin जी आप नियंत्रित कर सकते हैं) या आप इसे स्थिर एचटीएमएल –

उत्तर

12

वें वाले बच्चे आप सूची आइटम के लिए इसे लागू करने की आवश्यकता का उपयोग करने के,

http://jsfiddle.net/8SbbL/6/

आप भी उपयोग कर सकते हैं nth-child(even) और nth-child(odd) जो आपके 2n-1

+0

के रूप में स्वीकार कर सकता हूं अच्छा लग रहा है !!! –

+0

धन्यवाद! यह पूरी तरह से काम करता है! – Katy

+0

यह 'nth-child (यहां तक ​​कि) और nth-child (विषम) 'सरल है और अच्छी तरह से काम करता है। यह कोडिंग को और भी साफ करता है। धन्यवाद! – Jornes

1

तत्व ली के भीतर है, इसलिए यह हमेशा पहला और अंतिम तत्व होता है। वास्तविक ली पर एन-वें बाल चाल का प्रयोग करें।

#searchresult li:nth-child(2n+1) .displayBlogpost { 
    border: #B4C556 1px solid; 
} 

कार्य कांटा: http://jsfiddle.net/FJuzm/

+0

में भी बनाते हैं धन्यवाद! क्षमा करें मैं केवल एक जवाब को सही – Katy

संबंधित मुद्दे