Amfani da: nth-of-type (n) Tare da Tables
Don yin mahimman launi don karantawa, sau da yawa taimaka wa layukan layi tare da launuka masu launin baya. Ɗaya daga cikin hanyoyin da aka fi dacewa a cikin launi iri shine a saita launi na launi na kowace jere. Ana kiran wannan a matsayin "ratsan zebra".
Za ka iya cim ma wannan ta hanyar kafa kowace layi tare da kundin CSS sannan kuma ma'anar siffanta don wannan ɗakin. Wannan yana aiki amma ba shine mafi kyau ko hanya mafi kyau don tafiya ba.
Lokacin amfani da wannan hanya, duk lokacin da kake buƙatar gyara wannan tebur za ka iya yin gyara kowane jere guda ɗaya a cikin tebur don tabbatar da kowace jeri daidai da canje-canje. Alal misali, idan ka saka sabbin jeri zuwa teburinka, kowane layin da ke ƙasa yana buƙatar canzawa ajin.
CSS yana sa sauƙi ga teburin da aka yi tare da ratsan zebra. Ba ku buƙatar ƙara duk wani halayen halayen HTML ko CSS ba, za ku yi amfani kawai da: mai amfani na CSS (nth-of-type (n).
A: mai-nau'in (n) zaɓaɓɓiyar tsari ne a CSS wanda ya ba ka dama abubuwa masu mahimmanci dangane da dangantaka da iyayensu da kuma abubuwan da ke cikin sibling. Zaka iya amfani da shi don zaɓar ɗaya ko fiye da abubuwa bisa ga tsarin tushen su. A wasu kalmomi, zai iya daidaita kowane nau'i wanda yake shi ne yaro na wani nau'i na iyayensa.
Harafin n na iya zama keyword (kamar m ko ma), lambar, ko wata takamammen.
Alal misali, don yin salon kowane layi na sakin layi tare da launin launi marar launi, littafin CSS zai hada da:
p: nth-of-type (m) {
Bayanin: rawaya;
}
Fara tare da Gidan HTML ɗinku
Da farko, ƙirƙira tebur ɗinka kamar yadda zaka rubuta shi a cikin HTML. Kada ku ƙara kowane nau'i na musamman a cikin layuka ko ginshiƙai.
A cikin tsarin ku, ƙara CSS masu biyowa:
tr: nth-of-type (m) {
Ƙari-launi: #ccc;
}
Wannan zai sa kowane layi tare da launi mai launin launin launin farawa tare da jere na farko.
Tsarin Maɓalli na Yanki a Same hanya
Kuna iya yin irin wannan salo zuwa ginshiƙai a cikin teburinku. Don yin haka, kawai canza canjin a CSS a td. Misali:
td: nth-of-type (m) {
Ƙari-launi: #ccc;
}
Yin amfani da Formulas a cikin wani nau'in nth-of-type (n)
Haɗin da aka yi amfani da shi a cikin mai zaɓin yana da + b.
a yana da lambar da ta wakilci sake zagayowar ko girman nau'i na index.
n shi ne ainihin harafin "n" kuma ya wakilci counter, wanda taurari a 0.
+ shi ne mai aiki, wanda zai iya zama "-"
b shine lamba kuma wakiltar farashin biya - misali, yawancin layuka ya kamata mai zaɓa ya fara amfani da launin launi. Ana buƙatar wannan idan an haɗa wani mai aiki a cikin tsari.
Alal misali, idan kana son kafa launi na launi don kowace jere na 3, tsarinka zai zama 3n + 0. CSS ɗinku na iya kama da wannan:
tr: nth-of-type (3n + 0) {
bayanan: suma;
}
Ayyuka masu amfani don Yin amfani da mai amfani da nau'i-nau'i
Idan kuna jin kadan da hanyar da ake amfani da su ta hanyar yin amfani da sashin mai amfani da nau'i-nau'i, to gwada: shafin yanar gizon nth a matsayin kayan aiki mai amfani wanda zai iya taimaka maka ma'anar siginar don cimma burin da kake so. Yi amfani da jerin zaɓuɓɓuka don zaɓar nau'in nau'i-nau'i (kuma zaku iya gwadawa tare da wasu nau'i-nau'i a nan, ma, kamar nth-yaro).