A 'cleachdadh: nth-of-type (n) Le Clàran
Gus clàran nas fhasa a leughadh, tha e gu tric cuideachail stoidhlichean a dhèanamh le dàta eadar-dhealaichte. Is e aon de na dòighean as cumanta air clàran stoidhle dath cùl-raoin gach sreath eile a shuidheachadh. Thathas gu tric air ainmeachadh mar "zebra stripes."
Is urrainn dhut a choileanadh le bhith a 'suidheachadh gach sreath eile le clas CSS agus an uairsin a' mìneachadh an stoidhle airson a 'chlas sin. Tha seo ag obair ach chan e an dòigh as fheàrr no as èifeachdaiche a th 'ann.
Nuair a bhios tu a 'cleachdadh an dòigh seo, a h-uile turas a dh' fheumas tu airson an clàr sin a dheasachadh, is dòcha gum feum thu gach sreath anns a 'chlàr a dheasachadh gus dèanamh cinnteach gu bheil gach sreath co-chòrdail ris na h-atharrachaidhean. Mar eisimpleir, ma chuireas tu sreath ùr ris a 'bhòrd agad, feumaidh gach sreath eile gu h-ìosal an clas atharrachadh.
Tha CSS ga dhèanamh furasta do bhùird a stoidhle le stràcan zebra. Chan fheum thu feartan HTML no clasaichean CSS a bharrachd a chur ris, ach cleachd thu an: nth-of-type (n) roghnaiche CSS .
Tha an: nth-of-type (n) selector na class pseudo structarach ann an CSS a leigeas leat rudan a stoidhle stèidhichte air an dàimhean ri eileamaidean pàrant is sibling. Faodaidh tu a chleachdadh gus aon eileamaid no barrachd a thaghadh stèidhichte air an òrdugh tùs aca. Ann am faclan eile, faodaidh e a bhith a 'maidseadh a h-uile eileamaid a tha an leanabh aig ìre sònraichte a phàrant.
Faodaidh an litir n a bhith na phrìomh-fhacal (mar eisimpleir corr no eadhon), àireamh no foirmle.
Mar eisimpleir, airson stoidhle gach tag paragraf eile le dathan buidhe, bhiodh an sgrìobhainn CSS agad a 'gabhail a-steach:
p: nth-of-type (corr) {
cùl-raon: buidhe;
}
Tòisich le do chlàr HTML
An toiseach, cruthaich do bhòrd mar a bhiodh tu mar as trice air a sgrìobhadh ann an HTML. Na cuir clasaichean sònraichte sam bith ris na sreathan no na colbhan.
Anns an stoidhle agad, cuir ris na CSS a leanas:
tr: nth-of-type (corr) {
cùl-dath: #ccc;
}
Bidh seo a 'stoidhle gach sreath eile le dath cùil ghlas a' tòiseachadh leis a 'chiad sreath.
Colbhan Eileach Stoidhle anns an Same Way
Faodaidh tu an aon seòrsa stoidhle a dhèanamh do cholbhan anns na clàran agad. Gus seo a dhèanamh, dìreach atharraich an tr sa chlas CSS agad gu td. Mar eisimpleir:
td: nth-of-type (corr) {
cùl-dath: #ccc;
}
A 'cleachdadh Foirmlean ann an nth-of-type (n) Selector
Is e an + b a tha an co-chòrdadh airson foirmle a tha air a chleachdadh anns an taghadh.
Is e àireamh a tha a 'riochdachadh meud a' chuairt no clàr-amais.
Is e n an litir an toiseach "n" agus tha e a 'riochdachadh cùmhnanta, a tha a' cluich aig 0.
+ is gnìomhaiche, a dh 'fhaodadh a bhith cuideachd - - "
b b 'e sòim a th' ann agus tha e a 'riochdachadh an luach co-fhillte - mar eisimpleir, cia mheud sreathan a bu chòir ma thaghas an roghnaichear a' cur a-steach dath an cùl-raoin. Tha seo riatanach ma tha gnìomhaiche air a ghabhail a-steach san fhoirmle.
Mar eisimpleir, ma tha thu airson dath cùl-taic a shuidheachadh airson gach 3mh sreath, bhiodh an fhoirmle agad 3n + 0. Dh'fhaoidte gum biodh do CSS mar seo:
tr: nth-of-type (3n + 0) {
cùl-raon: sglèat;
}
Innealan feumail airson a bhith a 'cleachdadh roghnaichear nth-of-type
Ma tha thu a 'faireachdainn beagan mì-thoilichte le bhith a' cleachdadh an fhoirmle de bhith a 'cleachdadh roghnaichear nth-of-type class, feuch an làrach-lìn: nth Tester mar inneal feumail a chuidicheas tu gus an co-chòrdadh a mhìneachadh gus an sealladh a tha thu ag iarraidh a choileanadh. Cleachd an clàr-taice a tha a 'dol a-nuas gus nth-of-type a thaghadh (faodaidh tu cuideachd triail a dhèanamh le clasaichean pseudo eile an seo cuideachd, leithid nth-child).