Ag baint úsáide as: nth-of-type (n) Le Táblaí
Chun na táblaí a dhéanamh níos éasca a léamh, is minic a chabhródh sraitheanna stíl le dathanna cúlra malartacha. Ceann de na bealaí is coitianta le táblaí stíl ná dath cúlra gach sraith eile a leagan síos. Is minic a dtugtar "stripes seabra" orthu seo.
Is féidir leat é seo a bhaint amach trí shocrú gach sraith eile le rang CSS agus ansin an stíl a shainmhíniú don rang sin. Oibríonn sé seo ach níl an bealach is fearr nó is éifeachtaí chun é a dhéanamh.
Agus an modh seo á úsáid agat, gach uair is gá duit an tábla sin a chur in eagar, b'fhéidir go mbeadh ort gach sraith amháin a eagrú sa tábla lena chinntiú go bhfuil gach sraith ag teacht leis na hathruithe. Mar shampla, má chuireann tú sraith nua isteach ar do tábla, caithfidh gach sraith eile thíos an rang a athrú.
Déanann CSS go bhfuil sé éasca stáblaí a stíl le stripes seabra. Ní gá duit aon tréithe HTML breise nó ranganna CSS a chur leis, ach úsáid tú an: nth-of-type (n) selector CSS .
Is é an: nth-of-type (n) selector pseudo-class struchtúrach i CSS a ligeann duit stíl eilimintí bunaithe ar a gcaidrimh le heagraíochtaí eilimintí agus tuismitheora. Is féidir leat é a úsáid chun eilimintí amháin nó níos mó a roghnú bunaithe ar a n-ord foinse. I bhfocail eile, is féidir é a mheaitseáil le gach eilimint is ea an leanbh nár de chineál áirithe a tuismitheoir.
Is féidir leis an litir n eochairfhocal (mar shampla corr nó fiú), uimhir, nó foirmle.
Mar shampla, chun gach tag mír eile a stíl le dath cúlra buí, d'fholaíonn do dhoiciméad CSS:
p: nth-of-type (corr) {
cúlra: buí;
}
Tosaigh le Do Tábla HTML
Ar dtús, cruthaigh do bhord mar is gnách go scríobhfadh tú é i HTML. Ná cuir aon ranganna speisialta leis na sraitheanna nó na colúin.
I do bhileog bhileog, cuir an CSS seo a leanas leis:
tr: nth-of-type (corr) {
dath cúlra: #ccc;
}
Déanfaidh sé seo gach sraith eile le dath cúlra liath ag tosú leis an gcéad tsraith.
Colúin Malartacha Stíl sa Bhealach Same
Is féidir leat an cineál céanna stíl a dhéanamh do cholúin i do tháblaí. Chun é sin a dhéanamh, athraigh an tr i do rang CSS go dtí td. Mar shampla:
td: nth-of-type (corr) {
dath cúlra: #ccc;
}
Ag baint úsáide as Foirmlí i nth-of-type (n) Selector
Is é + b an comhréir le haghaidh foirmle a úsáidtear sa roghnóir.
Is uimhir a léiríonn an timthriall nó an méid innéacs.
Is i ndáiríre an litir "n" agus léiríonn sé an gcuntar, a réaltaí ag 0.
+ Is oibreoir é, a d'fhéadfadh a bheith "-"
b Is slánuimhir é agus léiríonn sé an luach fhritháireamh-mar shampla, cé mhéad sraitheanna ba chóir don roghnóir tús a chur leis an dath cúlra. Tá sé seo riachtanach má tá oibreoir san áireamh sa fhoirmle.
Mar shampla, más mian leat dath cúlra a leagan síos do gach tríú rás, bheadh 3n + 0 ar do fhoirmle. D'fhéadfadh do CSS breathnú mar seo:
tr: nth-of-type (3n + 0) {
cúlra: slategray;
}
Uirlisí cabhracha le húsáid Selector nth-of-type
Má tá tú ag mothú beagán ag baint leis an ngné fhoirmle maidir le húsáid an roghnóir nth-de-cineál pseudo-class, déan iarracht: an suíomh nth Tester mar uirlis úsáideach a chabhróidh leat an comhréir a shainmhíniú chun an cuma a theastaíonn uait a bhaint amach. Bain úsáid as an roghchlár mionsonraithe chun nth-de-chineál a roghnú (is féidir leat triail a dhéanamh le pseudo-ranganna eile anseo freisin, mar shampla nth-child).