Ukubeka iiNdawo eziQhathaniswayo ngeSpredish Style Sheets
Enye yemingeni xa usebenzisa i-CSS ukubeka i-web page layout kukuba ezinye zezinto zakho zingase zenzeke kwabanye. Oku kusebenza kakuhle ukuba ufuna into yokugqibela kwi-HTML ukuba ibe phezulu, kodwa kuthekani ukuba awunayo okanye uthini ukuba ufuna ukwenza izinto ezingenakudlulela abanye ukuba zenze njalo ngenxa yokuba uyilo lubiza ukuba le "jongene" ikhangele ? Ukuze uguqulwe indlela iindlela ezithe gqwa ngayo kufuneka usebenzise ipropati yeCSS.
Ukuba uye wasebenzisa izixhobo zemifanekiso kwiLizwi kunye nePowerPoint okanye umhleli wezithombe ezinamandla ezifana ne-Adobe Photoshop, ke amathuba ukuba ubonile into efana ne-index kwizenzo. Kule nkqubo, unokwazi ukugqamisa into okanye uyenze, kwaye ukhethe okukhethwa kukho ukuba "Thumela emuva" okanye "Yizisa phambi" izinto ezithile zedokhumenti yakho. Kwi-Photoshop, awunayo le mi sebenzi, kodwa unayo ifayile ye "Layer" yeprogram kwaye unokuhlela apho ilungu liwela kwinqanawa ngokuhlaziywa kwezi ziqendu. Kuzo zombini le mizekelo, ubeka i-z-index yalezo zinto.
Yiyiphi i-index?
Xa usebenzisa i-CSS ukubeka ukubeka izinto kwikhasi, kufuneka ucinge ngamanani amathathu. Kukho ubukhulu bomgangatho obini: kwesobunxele / kwesokudla kunye phezulu / ngaphantsi. Ikhohlo ekhohlo ukuya kwesokudla iyaziwa njenge-x-index, ngelixa phezulu ukuya kweyona enye y index. Nantsi indlela oza kubeka ngayo izinto ezizungezile okanye ezithe tye, usebenzisa ezi zihlomelo ezimbini.
Xa kungena kwi-web design, kukho kwakhona umyalelo wokuxakisha wephepha. Icandelo ngalinye elikwiphepha linokukhishwa ngaphezulu okanye ngaphantsi kweyiphi na into. Ipropati ye-z-index ichaza apho kukho kwisitaki ngasinye. Ukuba i-x-index kunye ne-y-index yimizila engqambileyo kunye nemigca, ngoko-indekisi ubunzulu bephepha, ngokukodwa isilinganiselo sesithathu.
Ndiyakuthanda ukucinga ngezinto ezisetyenziswe kwiphepha lewebhu njengamaqhekeza ephepha, kunye nephepha lewebhu ngokwalo njengesiko. Apho ndibeka khona iphepha lichongiwe ngokubeka indawo, kwaye ubuninzi balo buhlanganiswe ngenye impawu yi-z-index.
I-z-index yinani, nokuba lihle (umz. 100) okanye libi (umz. -100). I-index e-default yi-0. I-element ene-z-index ephezulu iphezulu, ilandelwa ngolu hlobo oluphezulu kwaye ngokunjalo ukuya kwi-index ephantsi. Ukuba izinto ezimbini zinexabiso elifanayo le-index (okanye lingachazwanga, lithetha ukusetyenziswa kwexabiso elingagqibekanga le-0) umkhangeli-mgcini-mgcini uya kuzibeka kwindlela ebonakala ngayo kwi-HTML.
Indlela yokusebenzisa i-index-index
Nika iqela ngalinye elifunayo kwi-stack yakho yexabiso le-z-index. Ngokomzekelo, ukuba ndinamalungu amahlanu ahlukeneyo:
- I-element 1-z-index ye -25
- isigaba 2 - i-index ye-82
- Isiqendu 3 - z-index asimiseli
- isigaba se-4-z-index ye-10
- Isalathisi sesi-5-z-index ye -3
Baya kugxina kule ndlela elandelayo:
- isigaba 2
- isigaba 4
- isigaba 3
- isigaba 5
- isigaba 1
Ndiyincoma ukusebenzisa i-z-value values ​​ezahlukeneyo ukubeka izinto zakho. Ngaloo ndlela, ukuba ungeze ezinye izinto kwikhasi kamva, unendawo yokuzifaka ngaphandle kokulungelelanisa ixabiso le-z-index kuzo zonke ezinye izinto. Umzekelo:
- 100 kwizinto eziphezulu kakhulu
- 0 kwinqanaba eliphakathi
- -100 kwizinto zam ezantsi
Unokunika ezimbini izinto ezifanayo z-index-value. Ukuba ezi zinto zibanjelwe, ziza kubonisa ngolu hlobo zibhalwa kwi-HTML, kunye nento yokugqibela phezulu.
Inqaku elilodwa, ukuba iqela lokusebenzisa ngokufanelekileyo ipropati ye-z-index, kufuneka libe yinqanaba lenqanaba lebhloko okanye isebenzise isibonakaliso se "block" okanye "inline block" kwifayile yakho yeCSS.
Inqaku loqobo loJennifer Krynin. Ulungiswe ngo-12/09/16 nguJeremy Girard.