Te whakanoho i nga Mea Taeke ki nga Pepa Whakairo
Ko tetahi o nga wero kei te whakamahi i te tautuhinga CSS mo te taapaki whārangi tukutuku ko etahi o nga mea ka taea e koe te kapo i etahi atu. He pai tenei ma te hiahia i te waahanga whakamutunga i roto i te HTML kia eke ki runga, engari he aha mehemea kaore koe, he aha ranei mehemea e hiahia ana koe ki te whai i nga huānga kaore nei e taapiri i etahi atu ki te mahi pera na te mea e kii ana te hoahoa mo tenei "titiro" ? Hei whakarereke i nga ahuatanga o te waahi ka hiahia koe ki te whakamahi i te taonga o CSS.
Mena kua whakamahia e koe he taputapu whakairoiro i roto i te Word me te PowerPoint, kaore ano hoki i te ahua o te kaitautoko ahua o Adobe Photoshop, ka kitea pea he mea rite ki te mahi-z-index. I roto i enei papatono, ka taea e koe te whakaatu i nga ahanoa i tuhia e koe, a ka whiriwhiri i tetahi waahanga ki te "Tukuna ki te hoki", ki te "Kawea ki mua" etahi o nga tuhinga o to tuhinga. I te Photoshop, kaore koe i enei mahi, engari kei a koe te pane "Layer" o te papatono, ka taea e koe te whakarite i te wa e taka te huanga ki roto i te whaera ma te whakatikatika i enei papa. I enei tauira e rua, kei te whakatakoto koe i te z-index o aua taonga.
He aha te z-index?
Ki te whakamahi koe i te tautuhinga CSS hei tohu i nga huānga i runga i te whaarangi, me whakaaro koe ki nga wahanga e toru. E rua nga paerewa paerewa: taha maui / taha matau, runga hoki. Ko te maui ki te taurangi taurangi e mohiotia ana ko te x-taurangi, ko te runga ki raro ko te te-y-index. Ko tenei me pehea e turangi ai i nga mea i runga i te taatai, i te poutai ranei, ma te whakamahi i enei taurangi e rua.
A, no te tae mai ki te hoahoa tukutuku, kei reira ano hoki te raupapa parenga o te whārangi. Ka taea e nga huanga katoa kei runga i te whaarangi te tuara ki runga ake ranei i raro i tetahi atu kaupapa. Ko te tahua-z-index te tohu i hea kei roto i te toka ko ia o nga mea. Mena ko te x-index me te y-taurangi ko nga rarangi whakapae me te poutū, na te z-index te hohonu o te whārangi, ko te waahanga tuatoru.
E hiahia ana ahau ki te whakaaro i nga kaupapa i runga i te pae tukutuku ano he pepa pepa, me te whārangi tukutuku ano hei kohinga. Te wahi e takoto ai ahau ka tuhia te pepa ma te tuunga, me te nui o te mea e hipokina ana e era atu huinga ko te z-index.
Ko te z-index he tau, he pai (hei tauira, 100), he kino ranei (hei tauira -100). Ko te z-index taunoa ko te 0. Ko te huānga me te z-index teitei kei runga, ka whai ake i te teitei ake me te pera ki raro ki te z-index. Mena e rua nga huānga he rite tonu te tau-z-index (kaore e tautuhia, te tikanga ko te whakamahi i te uara taunoa o 0) ka tuhia e te kaituhi i te rarangi ka puta mai i te HTML.
Me pehea te whakamahi i te z-index
Homai nga waeine e hiahia ana koe i roto i to ropu he tohu-tau-rereke rereke. Hei tauira, ki te mea he huinga rereke e rima:
- nama 1 - z-index o -25
- Tuhinga 2 - z-index o te 82
- te huinga 3 - z-index kore i tautuhia
- Tuhinga 4 - z-index o te 10
- Tuhinga 5 - z-index o -3
Ka tohatoha ratou i roto i te raupapa e whai ake nei:
- huinga 2
- Tuhinga 4
- nama 3
- Tuhinga 5
- huinga 1
E taunaki ana ahau ki te whakamahi i nga uara----------------------------- I taua ara, ki te whakauru atu koe i etahi atu huinga ki te whārangi i muri mai, ka whai waahi koe ki te tuhi i roto i te waahanga me te kore e whakatika i nga uara-z-index o nga atu huinga katoa. Hei tauira:
- 100 mo taku tino huanga
- 0 mo taku kaupapa waenga
- -100 mo taku kaupapa raro
Ka taea hoki e koe te whakarato i nga huinga e rua nga taua-z-index. Mena ka tohua enei huinga, ka whakaatu i roto i te raupapa ka tuhia ki te HTML, me te pito whakamutunga o runga.
Ko tetahi o nga korero, mo te huinga hei whakamahi i te taonga-z-index, kei te whakamahi i tetahi whakaaturanga o te "poraka", te "porowhita-taurangi" ranei i roto i to kōnae CSS.
He tuhinga taketake na Jennifer Krynin. I whakatikaia i te 12/09/16 na Jeremy Girard.