Ho sebelisa: nth-of-type (n) e nang le litafole
E le ho etsa hore litafole li be bonolo ho li bala, hangata hoa thusa melaong ea mebala le mebala e meng e mebala-bala. E 'ngoe ea litsela tse tloaelehileng tsa litafole tsa mokhoa oa ho ngola ke ho beha mobala oa mokokotlo oa mola o mong le o mong. Hangata sena se bitsoa "lipale tsa pere."
U ka finyella sena ke ho beha mohala o mong le o mong ka sehlopha sa CSS ebe o hlalosa mokhoa oa sehlopha seo. Sena se sebetsa empa ha se tsela e molemohali kapa e sebetsang ka ho fetisisa ea ho e etsa ka eona.
Ha u sebelisa mokhoa ona, nako le nako ha u hloka ho fetola tafole eo u ka tlameha ho e fetola mongolo o mong le o mong tafoleng ho netefatsa hore mola o mong le o mong o lumellana le liphetoho. Ka mohlala, haeba u kenya mola o mocha tafoleng ea hau, mola o mong le o mong ka tlase o hloka hore sehlopha se fetohe.
CSS e etsa hore ho be bonolo ho sebelisa litafole tsa li-zebra. Ha ho hlokahale hore u kenye litlatsetso tse ling tsa HTML kapa lik'hamera tsa CSS, u sebelisa feela: nth-of-type (n) khetho ea CSS .
The: nth-of-type (n) e khethileng ke sehlopha sa pseudo se hlophisitsoeng ka CSS se u lumellang hore u etse lintho tsa mokhoa oa ho ngola ka likamano tsa bona le likarolo tsa motsoali le banab'eno. U ka e sebelisa ho khetha lintlha tse le 'ngoe kapa tse ling tse thehiloeng mohloling oa tsona. Ka mantsoe a mang, e ka bapisa ntho e 'ngoe le e' ngoe eo e leng ngoana oa nth ea mofuta o itseng oa motsoali oa eona.
Lengolo la n le ka ba lentsoe le ka sehloohong (tse kang tse sa tloaelehang kapa esita le), palo, kapa mokhoa o itseng.
Ka mohlala, ho ngola serapa se seng le se seng se tšoaea 'mala oa mosehla, moqolo oa hau oa CSS o tla kenyelletsa:
p: nth-of-type (e makatsang) {
semelo: mosehla;
}}
Qala ka Letlapa la Hao la HTML
Ntlha ea pele, bopa tafole ea hau joalokaha u ne u tla e ngola ka HTML. U se ke ua eketsa lihlopha tse khethehileng ho mela kapa lihlopha.
Ka mokhoa oa hau oa lipapali, eketsa CSS e latelang:
tr: nth-of-type (e makatsang) {
mobala-kahare: #ccc;
}}
Sena se tla beha mola o mong le o mong ka mobala o mofubelu o mofubelu ho qala ka mola oa pele.
Mekhoa e Mecha ea Mekhoa ka Tsela e Tšoanang
U ka etsa mofuta o tšoanang oa setaele ho lihlopha tafoleng ea hau. E le hore u etse joalo, fetola feela tr kahare ea hau ea CSS ho ea ho td. Ka mohlala:
td: nth-of-type (e makatsang) {
mobala-kahare: #ccc;
}}
Ho Sebelisa Mekhoa ka mofuthu oa nth-of-type (n)
Tlhaloso ea motsoako o sebelisitsoeng ho khethiloeng ke + b.
a ke palo e emelang potoloho kapa boholo ba index.
Ha e le hantle ke lengolo "n" 'me le emela counter, e leng linaleli tse 0.
+ ke mokhanni, eo hape e ka bang "-"
b ke tekanyo e kholo 'me e emela bohlokoa ba offset-ka mohlala, hore na mela e mengata e tlase ha mo khethi a qala ho sebelisa mobala oa mokokotlo. Sena se hlokeha haeba moferefere a kenyelelitsoe lebisong.
Ka mohlala, haeba u batla ho beha 'mala oa mokokotlo oa molaetsa o mong le o mong oa boraro, mochine oa hau o tla ba 3n + 0. CSS ea hau e ka shebahala tjena:
tr: nth-of-type (3n + 0) {
semelo sa morao: slategray;
}}
Lisebelisoa tse thusang ho sebelisa Selethisi ea mofuta oa nth-type
Haeba u ikutloa u tsielehile ka lebaka la ho sebelisa moqapi oa mofuta oa bo-nth-of-type, leka: Nth Tester site e le sesebelisoa se sebetsang se ka u thusang ho hlalosa li-syntax ho fihlela kamoo u batlang kateng. Sebelisa menu e theoha ho khetha nth-of-type (o ka boela oa leka ka litsela tse ling tsa maqheka mona, hape, joalo ka nth-child).