انتخاب شماره هایی (مثلا اول و چهارم و هفتم و ...) از تکرارهای یک عنصر خاص (به ترتیب قرارگیری در صفحه)، بر اساس یک فرمول دنباله ریاضی (بر حسب …,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 :

نتیجه :

خطا - صفحه را دوباره بارگذاری کنید
نویسنده علیرضا گلمکانی
شماره کلید 26607
گزینه ها
به اشتراک گذاری (Share) در شبکه های اجتماعی
نظرات 0 0 0

ارسال نظر جدید (بدون نیاز به عضو بودن در وب سایت)