पसूडोक्लास nth-last-of-type

पसूडोक्लास nth-last-of-type उस एलिमेंट को चुनता है जो अपने पैरेंट का n-वां चाइल्ड होता है दिए गए टाइप का, अंत से गिनती करते हुए। यह nth-of-type के समान ही काम करता है, बस गिनती अंत से होती है।

सिंटैक्स

cssसिलेक्टर:nth-last-of-type(संख्या | odd | even | एक्सप्रेशन) {
  
}

वैल्यूज

वैल्यू	विवरण
संख्या	`1` से शुरू होने वाला एक पॉजिटिव नंबर। उस एलिमेंट की पोजीशन को स्पष्ट करता है, जिसे टारगेट करना चाहते हैं। एलिमेंट्स की नंबरिंग `1` से शुरू होती है।
`odd`	विषम स्थान के एलिमेंट्स।
`even`	सम स्थान के एलिमेंट्स।
एक्सप्रेशन	अक्षर n के साथ विशेष एक्सप्रेशन बना सकते हैं, जो शून्य (एक नहीं) से लेकर अनंत तक सभी पूर्णांकों को दर्शाता है। इस तरह, `2n` का मतलब सभी सम नंबर होंगे (दूसरे से शुरू करके)। इसे कैसे समझें? `n` में क्रमिक रूप से `0` और आगे के नंबर रखते जाएं: यदि n = 0, तो 2n 0 देगा - ऐसा कोई एलिमेंट नहीं होता (एलिमेंट्स की नंबरिंग 1 से होती है), यदि n = 1, तो 2n 2 देगा - दूसरा एलिमेंट, यदि n = 2, 2n 4 देगा - चौथा एलिमेंट। यदि 3n लिखें - यह हर तीसरा एलिमेंट होगा (तीसरे से शुरू करके), और इसी तरह आगे।

उदाहरण

h2 ढूंढते हैं, जो 2-वां h2 हो अपने पैरेंट में अंत से गिनती करने पर:

html<div>
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
</div>

cssh2:nth-last-of-type(2) {
  color: red;
}

Результат:

उदाहरण

अंत से सभी सम h2 ढूंढते हैं:

html<div>
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
</div>

cssh2:nth-last-of-type(even) {
  color: red;
}

Результат:

उदाहरण

अंत से सभी विषम h2 ढूंढते हैं:

html<div>
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
  
  <h2>शीर्षक</h2>
  <p>पैराग्राफ</p>
</div>

cssh2:nth-last-of-type(odd) {
  color: red;
}

Результат: