Ukubeka ama-Elements Elepping nge Ama-Sheet Style Amashidi
Enye yezinselelo lapho usebenzisa ukubeka kwe-CSS kwekhasi lewebhu lewebhu ukuthi ezinye zezici zakho zingase zifinyelele kwabanye. Lokhu kusebenza kahle uma ufuna isici sokugcina ku-HTML ukuba sibe phezulu, kodwa kuthiwani uma ungenayo noma ungenzani uma ufuna ukuthola izakhi okwamanje ezingapheli abanye ukuba benze kanjalo ngoba umklamo udinga lokhu kubheka "okuhlelekile" ? Ukuze ushintshe indlela izakhi ezihamba ngayo udinga ukusebenzisa impahla ye-CSS.
Uma ususebenzise amathuluzi wehluzo ku-Word and PowerPoint noma umhleli wesithombe esinamandla njengo-Adobe Photoshop, khona-ke kungenzeka ukuthi ubone into enjenge-z-index esenzweni. Kulezi zinhlelo, ungakwazi ukugqamisa into (ama) oyikhiphe, bese ukhetha okukhethwa kukho kokuthi "Thumela emuva" noma "Letha phambili" izakhi ezithile zomqulu wakho. Ku-Photoshop, awunayo le misebenzi, kodwa unekhasi le "Layer" lohlelo futhi ungahlela lapho isici siwela khona ngendwangu ngokulungisa kabusha lezi zendlalelo. Kuzo zombili lezi zibonelo, ubeka ngokuyisisekelo i-z-index yalezo zinto.
Iyini i-index?
Uma usebenzisa ukuma kwe-CSS ukuze ubeke izakhi ekhasini, udinga ukucabanga ngezilinganiso ezintathu. Kunezilinganiso ezimbili ezijwayelekile: kwesokunxele / kwesokudla futhi phezulu / ngezansi. Inkomba kwesobunxele kuya kwesokudla iyaziwa njenge-x-index, kanti phezulu kuya kwesinye kukhona y-index. Yile ndlela ozobeka ngayo izakhi ngokuzenzekelayo noma ngokuzenzekelayo, usebenzisa lezi zikhombo ezimbili.
Lapho kungena kumklamo wewebhu, kukhona nokuhlelwa kwekhasi lekhasi. Into ngayinye ephepheni ingahle ibekwe ngaphezulu noma ngaphansi kwanoma iyiphi enye into. Indawo ye-z-index inquma ukuthi ikuphi emgqeni isici ngasinye. Uma i-x-index kanye ne-y-index yizingqimba ezizungezile neziqondile, khona-ke u-z-index ukujula kwekhasi, ngokuyinhloko ubukhulu besithathu.
Ngithanda ukucabanga ngezakhi ezisekhasini lewebhu njengezicucu zephepha, nekhasi lewebhu ngokwayo njengamakholaji. Lapho ngibeka khona leli phepha linqunywe ukubeka, nokuthi lihlanganiswa kangakanani nezinye izakhi yi-z-index.
I-z-index inomboro, noma ihle (isib. 100) noma ayibi (isib -100). Inkomba ye-z ezenzakalelayo i-0. Isici esinayo i-z-index esiphezulu siphezulu, silandelwa yi-esiphezulu esilandelayo nokunye phansi kuze kube e-index ephansi kakhulu. Uma izakhi ezimbili zinezinga elifanayo le-index (noma lingachaziwe, okusho ukuthi ukusebenzisa inani elizenzakalelayo le-0) isiphequluli sizoyibeka eceleni ukuze ivele ku-HTML.
Indlela yokusebenzisa i-z-index
Nikeza into ngayinye oyifunayo emgqeni wakho ngezinga elihlukile le-index. Isibonelo, uma nginezinto ezinhlanu ezahlukene:
- isici 1 - z-index ye--25
- isici 2 - i-index ye-82
- i-element 3 - z-index ayibekiwe
- isici 4 - z-index ye-10
- isici sesi-5 - z-index se--3
Bazobe bafaka ngokulandelana okulandelayo:
- isici 2
- isigaba 4
- isici 3
- isici 5
- isici 1
Ngincoma ukusebenzisa ama-z-index amanani ahlukene kakhulu ukuze ubeke izakhi zakho. Ngaleyo ndlela, uma ufaka izakhi ngaphezulu kwekhasi kamuva, unendawo yokuzifaka ngaphandle kokuthi ulungise amanani we-z-index azo zonke ezinye izakhi. Ngokwesibonelo:
- 100 yezinto zami eziphezulu kakhulu
- 0 isici sami esiphakathi
- -100 ngento engezansi
Unganika futhi izakhi ezimbili zenani elifanayo le-index. Uma lezi zakhi zifakwa, zizobonisa ngendlela ebhalwa ngayo ku-HTML, ne-element yokugcina phezulu.
Inothi elilodwa, ukuze isici sisebenzise kahle i-z-index impahla, kufanele ibe isici sezinga lokuvimba noma isebenzise ukubonisa "block" noma "inline-block" kufayili yakho ye-CSS.
Isihloko sokuqala sikaJennifer Krynin. Ihlelwe ngo-12/09/16 nguJeremy Girard.