انتخاب شماره های زوج یا فرد از تکرارهای یک عنصر خاص در صفحه، با انتخابگر nth-child ، به شکل های (nth-child(even و (nth-child(odd یا شکل های (nth-child(2n و (nth-child(2n+1 ، در CSS
در کلید شماره 26607 ، یک انتخابگر (Selector) با نام nth-child را معرفی کردیم که برای انتخاب عنصرهای صفحه بر اساس عبارت ریاضی (دنباله ریاضی) بر حسب n به کار می رفت که در آن عبارت ریاضی، n از شماره 1 شروع می شد و به صورت 1 و 2 و 3 و ... تا شماره آخرین عنصر از آن نوع در صفحه، ادامه داشت.
این قابلیت انتخابگر nth-child ، به ما این امکان را می دهد که شماره های زوج یا فرد از یک عنصر خاص در صفحه را انتخاب نماییم.
برای انتخاب شماره های زوج (شماره های 2 و 4 و 6 و 8 و ...)، انتخابگر nth-child را به یکی از دو صورت زیر می نویسیم :
که در دومی، عبارت 2n را به کار برده ایم که متناظر با شماره های زوج می باشد :
و برای انتخاب شماره های فرد (شماره های 1 و 3 و 5 و 7 و ...)، انتخابگر nth-child را به یکی از دو صورت زیر می نویسیم :
که در دومی، عبارت 2n+1 را به کار برده ایم که متناظر با شماره های فرد می باشد :
به مثال زیر توجه کنید :
یک فهرست (List) تعریف می کنیم و سپس تعیین می نماییم که رنگ پس زمینه های عنصرهای (تگ li) فرد آن برابر سبز (green) و رنگ پس زمینه عنصرهای (تگ li) زوج آن برابر زرد (yellow) باشد.
بخش مهم کدها :
کد کامل صفحه HTML :
نتیجه :
یک فهرست (List) تعریف می کنیم و سپس تعیین می نماییم که رنگ پس زمینه های عنصرهای (تگ li) فرد آن برابر سبز (green) و رنگ پس زمینه عنصرهای (تگ li) زوج آن برابر زرد (yellow) باشد.
بخش مهم کدها :
کد کامل صفحه HTML :