ब्लॉक के पहले एन तत्व कैसे दिखाएं और दूसरों को सीएसएस में छुपाएं?

Question

मैं .container ब्लॉक के अंदर कक्षा .row वाले पहले 3 तत्वों को छिपाने की कोशिश कर रहा हूं।

क्या मैं कर रहा हूँ सब .row पहले छिपा है, और फिर मैं .row:nth-child(-n+3)

jsfiddle यहाँ का उपयोग करके पहले 3 .row प्रदर्शित करने के लिए कोशिश कर रहा हूँ: http://jsfiddle.net/z8fMr/1/

मैं यहाँ दो समस्याएं हैं:

1. पंक्ति 3 प्रदर्शित नहीं होता है, क्या मैं गलत तरीके से एनएच-बच्चे का उपयोग कर रहा हूं?
2. क्या सब कुछ छिपाने से पहले एक बेहतर अभ्यास है और फिर मैं पहले तत्वों को प्रदर्शित करने के लिए एक विशिष्ट नियम बना रहा हूं? क्या सीएसएस में पहले 3 .row को प्रदर्शित करने का कोई तरीका है और फिर अन्य सभी .row छुपाएं?

धन्यवाद।

Answer 1

1. आप पहले बच्चे के रूप में एक .notarow है, तो आप अपने :nth-child() सूत्र में है कि के लिए खाते में करने के लिए है। कि .notarow की वजह से, अपने पहले .row माता पिता की दूसरी संतान समग्र हो जाता है, तो आप दूसरे से चौथे शुरू गिनती करने के लिए है:

   .row:nth-child(-n+4){ 
       display:block; 
   } 
   

   Updated fiddle

2. क्या आप कर रहे हैं ठीक है ।

Answer 2

तुम भी CSS3 के चयनकर्ताओं की जरूरत नहीं है:

.row + .row + .row + .row { 
    display: none; 
} 

यह IE7 में भी काम करना चाहिए।
Updated fiddle

Answer 3

इसके अलावा, जियोवानी के समाधान की तरह, ऐसा कुछ भी काम कर सकता है।

.container > .row:nth-child(3) ~ .row { 
    /* this rule targets the rows after the 3rd .row */ 
    display: none; 
}