Fampiasana: nth-of-type (n) miaraka amin'ny tabilao
Mba hahamora kokoa ny famakiana ny latabatra, dia manampy matetika ny mamolavola ireo loko misy loko miavaka. Ny iray amin'ireo fomba mahazatra indrindra hanamboarana tabilao dia ny mametraka ny loko afara amin'ny andalana hafa. Matetika izy io no antsoina hoe "zebras".
Azonao atao ny manamboatra ny andalana hafa amin'ny kilasy CSS ary avy eo mamaritra ny fomba hananana ilay kilasy. Ity asa ity dia tsy fomba tsara indrindra na mahomby indrindra handehanana.
Rehefa mampiasa io fomba io ianao, isaky ny mila manitsy izany latabatra izany ianao dia mety mila manitsy ny laharana rehetra ao anaty latabatra mba hahazoana antoka fa ny andalana tsirairay dia mifanaraka amin'ny fanovana. Ohatra, raha ampidirinao ny latabatra vaovao eo amin'ny latabatrao, ny andalana rehetra etsy ambany dia mila manova ny kilasy.
CSS dia mahatonga azy ho mora ny manamboatra tabilao miaraka amin'ny zebra zebra. Tsy mila ampiana singa HTML hafa na CSS ianao, ampiasainao fotsiny ny: sth-of-type (n) CSS selector .
Ny: nth-of-type (n) selector dia pseudo-class classique amin'ny CSS izay ahafahanao manamboatra singa mifototra amin'ny fifandraisana amin'ny ray aman-dreny sy ny tarika. Azonao ampiasaina izany mba hisafidianana singa iray na maromaro mifototra amin'ny baikon'ilay loharano. Amin'ny teny hafa dia afaka mifanandrify ireo singa rehetra izay ny zaza lahimatoa amin'ny karazana ray aman-dreniny manokana.
Ny litera n dia mety ho teny fanalahidy (toy ny mahagaga na dia), na maromaro na rohy.
Ohatra, ny fanoratana ny andalana fehintsoratra hafa rehetra miaraka amin'ny loko mavomavo mavo, dia ahitana ny rakitra CSS:
p: nth-of-type (odd) {
background: yellow;
}
Atombohy amin'ny tabilao HTML
Voalohany, mamoròna ny latabatrao araka izay tianao hanoratanao azy amin'ny HTML. Aza asiana kilasy manokana ao amin'ny laharana na ny tsanganana.
Ampiasao ao amin'ny stylesheet ny CSS manaraka:
tr: nth-of-type (odd) {
fototra-color: #ccc;
}
Izany dia hametraka ny andalana hafa miaraka amin'ny loko mavokely manomboka amin'ny laharana voalohany.
Fametrahana Columns ankoatra ny lalana mitovy amin'izany
Azonao atao ny manamboatra karazany mitovy amin'ny tsanganana ao amin'ny latabatrao. Raha hanao izany ianao, dia ampitahao tsotra ny tr amin'ny kilasinao CSS ao amin'ny td. Ohatra:
td: nth-of-type (odd) {
fototra-color: #ccc;
}
Amin'ny fampiasana ny Formulas amin'ny sari-kaonty nth-of-type (n)
Ny fehezanteny iray ampiasaina ao amin'ny selector dia b + a.
a dia isa izay maneho ny vanim-potoana na ny habaka.
n dia ny litera "n" ary manondro kifafa, izay kintana amin'ny 0.
+ dia mpandraharaha, izay mety ho "-"
b dia singa iray manontolo ary maneho ny sanda afatratra - ohatra, firy ny laharana maromaro tokony hanomboka hametrahana ny loko afara ny mpihaza. Ilaina izany raha toa ka misy mpampiasa iray ao anatin'ilay rindranasa.
Ohatra, raha tianao ny hametraka loko afara amin'ny andalana fahatelo, dia ho 3n + 0 ny fombanao. Ny CSS dia mety toy izao:
tr: nth-of-type (3n + 0) {
background: slategray;
}
Fanampiana mahasoa amin'ny fampiasana ny karazana sanda
Raha toa ianao ka somary sahiran-doha amin'ny endrika fanalahidy amin'ny fampiasana ny pseudo-class sth-of-type selector, andramo ny tranokala: nth Tester ho toy ny fitaovana mahasoa izay afaka manampy anao hamaritra ny soratao hahatratrarana ny fijery tianao. Ampiasao ny sakafo fanontana mba hisafidianana karazana nth-of-type (afaka manandrana ihany koa amin'ny pseudo-kilasy hafa eto, toy ny nnd-zaza ihany koa).