ප්‍රතිසම වර්ගය nth-last-child
ප්‍රතිසම වර්ගය nth-last-child යනු
දෙමාපියෙකුගේ n වැනි ළමයා තෝරා ගන්නා අතර,
ගණන් කිරීම අවසානයේ සිට සිදු කෙරේ. එය
nth-child
හා සමාන ලෙස ක්‍රියා කරයි,
නමුත් ගණන් කිරීම අවසානයේ සිට සිදු වේ.
වාග් රීතිය
cssතෝරන්නා:nth-last-child(අංකය | odd | even | ප්‍රකාශනය) {
}
අගයන්
| අගය | විස්තරය |
|---|---|
| අංකය |
1 වෙතින් ආරම්භ වන ධන අංකය.
අපට පිළිපැදීමට අවශ්‍ය මූලද්‍රව්‍යයේ අංකය
නියම කරයි. මූලද්‍රව්‍ය අංකනය 1 වෙතින් ආරම්භ වේ.
|
odd |
ඔත්තේ මූලද්‍රව්‍ය. |
even |
ඉරට්ටේ මූලද්‍රව්‍ය. |
| ප්‍රකාශනය |
n අකුර සමඟ විශේෂ ප්‍රකාශන සෑදිය හැකිය,
එය ශුන්‍යයේ සිට (එකෙන් නොව) අනන්තය දක්වා
සියලු පූර්ණ සංඛ්‍යා නිරූපණය කරයි. එබැවින්, 2n යනු
සියලු ඉරට්ටේ අංක (දෙවැන්නෙන් ආරම්භ වන) යන අර්ථය ඇත.
මෙය කෙසේ අවබෝධ කර ගත හැකිද? n වෙත
0 වෙතින් අනුපිළිවෙලින් සංඛ්‍යා ආදේශ කරන්න:
n = 0 නම්, 2n ලබා දෙන්නේ 0 - එවැනි මූලද්‍රව්‍යයක්
නොමැත (මූලද්‍රව්‍ය අංකනය 1 සිට),
n = 1 නම්, 2n ලබා දෙන්නේ 2 - දෙවන මූලද්‍රව්‍යය,
n = 2 නම්, 2n ලබා දෙන්නේ 4 - හතරවන මූලද්‍රව්‍යය.
3n ලියන්නේ නම් - එය
සෑම තුන්වන මූලද්‍රව්‍යයම (තුන්වැන්නෙන් ආරම්භ වන) වනු ඇත,
සහ යනාදිය.
|
නිදර්ශනය
මෙම නිදර්ශනයේ දී, අපි රතු පැහැයෙන්
li සාදන්නෙමු, එය එහි දෙමාපියෙකුගේ
4 වැනි අවසානයේ සිට
ළමයා වේ:
html<ul>
<li>ලැයිස්තු අයිතමය</li>
<li>ලැයිස්තු අයිතමය</li>
<li>ලැයිස්තු අයිතමය</li>
<li>ලැයිස්තු අයිතමය</li>
<li>ලැයිස්තු අයිතමය</li>
</ul>cssli:nth-last-child(4) {
color: red;
}
Результат:
නිදර්ශනය
දැන් අපි සියලු
ඉරට්ටේ අවසානයේ සිට li රතු කරන්නෙමු:
html<ul>
<li>ලැයිස්තු අයිතමය</li>
<li>ලැයිස්තු අයිතමය</li>
<li>ලැයිස්තු අයිතමය</li>
<li>ලැයිස්තු අයිතමය</li>
<li>ලැයිස්තු අයිතමය</li>
</ul>cssli:nth-last-child(even) {
color: red;
}
Результат:
නිදර්ශනය
දැන් අපි සියලු ඔත්තේ අවසානයේ සිට
li රතු කරන්නෙමු:
html<ul>
<li>ලැයිස්තු අයිතමය</li>
<li>ලැයිස්තු අයිතමය</li>
<li>ලැයිස්තු අයිතමය</li>
<li>ලැයිස්තු අයිතමය</li>
<li>ලැයිස්තු අයිතමය</li>
</ul>cssli:nth-last-child(odd) {
color: red;
}
Результат:
නිදර්ශනය
දැන් අපි සෑම තුන්වන
අවසානයේ සිට li රතු කරන්නෙමු:
html<ul>
<li>ලැයිස්තු අයිතමය</li>
<li>ලැයිස්තු අයිතමය</li>
<li>ලැයිස්තු අයිතමය</li>
<li>ලැයිස්තු අයිතමය</li>
<li>ලැයිස්තු අයිතමය</li>
</ul>cssli:nth-last-child(3n) {
color: red;
}
Результат: