انتخاب شماره هایی (مثلا اول و چهارم و هفتم و ...) از تکرارهای یک عنصر خاص (به ترتیب قرارگیری در صفحه)، بر اساس یک فرمول دنباله ریاضی (بر حسب …,n=0,1,2,3)، با انتخابگر nth-child ، به شکل مشابه (nth-child(3n+1 ، در CSS
فرض کنید که یک عنصر خاص، چندین بار در صفحه به کار رفته است و اکنون قصد داریم که بر اساس شماره های مربوط به تکرارهای آن عنصر در صفحه، تعدادی از آنها را انتخاب کنیم.
اگر شماره های مورد نظر ما، به صورت یک دنباله ریاضی (بر حسب …,n=0,1,2,3) بیان شوند، آنگاه می توانیم به جای ذکر کردن خود شماره ها، دنباله ریاضی متناظر با آنها را بیان کنیم.
به عنوان مثال، دنباله زیر را در نظر بگیرید :
بنابراین برای …,n=0,1,2,3 داریم :
این دنباله ریاضی اگر به کار رود، به شماره های اول و چهارم و هفتم و دهم و ... از یک عنصر خاص در صفحه، اشاره خواهد کرد.
بنابراین اگر دنباله ریاضی بالا را به انتخابگر nth-child بدهیم (که شماره دریافت می کند و بر اساس آن، به چندمین تکرار از یک عنصر خاص اشاره می کند)، می توانیم به آن شماره ها از عنصر خاص مورد نظرمان، اشاره نماییم :
برای درک بهتر این موضوع، به مثال زیر توجه کنید :
یک فهرست (List) می سازیم و تعیین می کنیم که عناصر (تگ های li) موجود در آن، بر اساس دنباله ریاضی 3n+1 (یعنی عنصر اول و چهارم و هفتم و ...)، دارای پس زمینه به رنگ زرد (yellow) باشند.
بخش مهم کدها :
کد کامل صفحه HTML :