Чӣ тавр эҷод кардани ҷадвалҳои Сартра бо CSS

Истифода аз: nth-of-type (n) Бо ҷадвалҳо

Барои ҷадвалҳои осонтар хондан осонтар аст, ки барои рангҳои оддӣ бо рангҳои алтернативӣ муфид аст. Яке аз усулҳои маъмултарини ҷадвалҳои сабку услуби ранги заминаи ҳар як сатр. Ин аксар вақт ҳамчун "шерраҳо" номида мешавад.

Шумо метавонед ин корро бо роҳи муайян кардани ҳар дигар бо класси CSS ва сипас стиларо муайян кунед. Ин кор мекунад, вале роҳи беҳтарини аз ҳама самарабахшро дар бар мегирад.

Ҳангоми истифодаи ин усул, ҳар вақт шумо бояд таҳрир кардани ин ҷадвалро дошта бошед, шумо бояд ҳар як сатрро дар ҷадвал нишон диҳед, то ки ҳар як сатр бо тағйирот мувофиқ бошад. Масалан, агар шумо ба сатри нав ба ҷадвалҳои худ гузоред, ҳар як сатр поёнтар аз он бояд синф тағйир дода шавад.

CSS осори ҷадвалро бо ҷилдҳои зардро осон мекунад. Ба шумо лозим нест, ки ягон хусусиятҳои HTML ё CSS-и иловагӣ илова кунед, шумо фақат интихоби интихобшударо (n) C-ро интихоб кунед .

Интихоби сеги-навъи (n) интихоби pseudo-class дар CSS мебошад, ки ба шумо имконият медиҳад, ки элементҳоро дар асоси муносибатҳои онҳо ба волидайн ва ҳамсарон ба ҳам пайваст намоед. Шумо метавонед онро барои интихоби як ё якчанд унсурҳо дар асоси фармоиши сарчашмаи худ истифода баред. Ба ибораи дигар, он метавонад ҳар унсуреро, ки кӯдакони навъи волидайни худ дорад, мувофиқ бошад.

Номаи n метавонад калимаи калидӣ бошад (масалан, танҳо ё ҳатто), рақам ё форм.

Масалан, ба ҳар як параграфи дигар бо рангҳои зардии зард, сабт кунед, ҳуҷҷати CSS-и шумо дар бар мегирад:

П.-и-навъи (odd) {
замина: зард;
}}

Бо ҷадвал HTML бо шумо оғоз кунед

Пеш аз он, ҷадвалро офаред, ки шумо одатан дар HTML навишта метавонед. Ба дарсҳо ё сутунҳо ягон синфҳои махсус илова накунед.

Дар варақаи шумо, CSS-и зеринро илова кунед:

tr: nth-of-type (odd) {
Ранги аслии: #ccc;
}}

Ин ба ҳар як сатр бо ранги аслии хокистарӣ шурӯъ хоҳад кард.

Силсилаи такрори аломатҳои якхела

Шумо метавонед ба ҳамон як намуди сабзиш ба сутунҳо дар ҷадвалҳои худ кор кунед. Барои ин, танҳо ба TR дар синфи CSS худро тағир диҳед. Барои намуна:

td: навъи навъи (odd) {
Ранги аслии: #ccc;
}}

Истифодаи формулаҳо дар интихоби сайти (n) навъи (n)

Синтаксиси як формулаи дар интихоби истифодашаванда + b.

Масалан, агар шумо хоҳед, ки ранги заминаро барои ҳар як сутуни 3 муқаррар кунед, формулаи шумо 3n + 0 бошад. CSS-и шумо метавонад чунин бошад:

tr: nth-of-type (3n + 0) {
замина: slateray;
}}

Асбобҳои ёрирасон барои истифодаи интихоби nth-of-type

Агар шумо эҳсос кунед, ки каме аз рӯи формулаи формулаи истифодаи интихоби pseudo-type-type-type, кӯшиш кунед, ки сайти Тестро ҳамчун воситаи муфид, ки метавонад ба шумо фаҳмонад, ки синтезро барои ноил шудан ба назаратон мехоҳед муайян кунед. Менюи тирезаро барои интихоби nth-type-ро истифода баред (шумо низ метавонед бо дигар синфҳои синф дар инҷо низ, ба мисли nth-child озмоиш кунед).