Homai ki to paetukutuku to maatau ataata me nga whakairoiro papamuri
Ko nga whakaahua he waahanga nui o nga hoahoa paetukutuku. Kei roto i tenei ko te whakamahinga o nga whakaahua papamuri. Koinei nga whakaahua me nga whakairoiro e whakamahia ana i muri o nga waahanga o te wharangi kaore i tuhia ki nga whakaahua e whakaatuhia ana hei waahanga o nga waarangi ihirangi. Ka taea e enei whakaahua taapiri te hono atu i te hiahia toi ki tetahi whārangi, ka awhina ia koe ki te whakatutuki i te hoahoa ataata e rapu ana koe i runga i tetahi whaarangi.
Mena ka timata koe ki te mahi me nga whakaahua papamuri, ka rere tonu koe ki te ahuatanga e hiahia ana koe kia whakairihia he whakapakoko kia pai ai te whārangi.
He tino pono tenei mo nga paetukutuku e urupare ana e tukuna ana ki te maha o nga whakaaro me nga rahi o te mata .
Ko tenei hiahia ki te whakapiki i te ahua o muri ko te hiahia nui mo nga kaihoahoa tukutuku no te mea kaore nga whakaahua katoa e pai ki te waahi o te paetukutuku. Engari i te whakatakoto i te rahi o te waahanga, ko te whakarewa i te whakapakoko ka taea te whakaheke ki te whakauru i te whārangi ahakoa te rahi o te matapihi o te matapihi .
Ko te huarahi pai ki te whakapiri i tetahi whakapakoko kia uru ki te papamuri o te whārangi ko te whakamahi i te taonga CSS3 , mo te rahi-te rahi. Anei he tauira e whakamahi ana i te ahua papamuri mo te tinana o te whaarangi me te tautuhi i te rahi ki te 100% kia kaha tonu ai te whakawhiti ki te mata.
tinana {
muri: url (bgimage.jpg) kore-ano;
rahi-rahi: 100%;
}
E ai ki a caniuse.com, kei te mahi tenei taonga i te IE 9+, Firefox 4+, Opera 10.5+, Safari 5+, Chrome 10.5+, me te katoa o nga pūtirotiro pūkoro nui. Ka hipoki tenei ki a koe mo nga pukenehi hou katoa e wātea ana i tenei ra, ko te tikanga me whakamahi koe i tenei taonga me te kore wehi ka kore e mahi i te mata o tetahi.
Whakaritea i te Papamuri Whakamahia i Nga Pūtirotiro Tawhito
Kaore pea pea ka hiahia koe ki te tautoko i tetahi kaituhi pakeke atu i te IE9, engari kia mahara koe kei te raru koe kei te tautoko a IE8 i tenei taonga. I roto i taua tauira, ka taea e koe te wetewete i te whanui. A ka taea e koe te whakamahi i nga purihanga pūtirotiro mo Firefox 3.6 (-moz-background-size) me Opera 10.0 (-o-papamuri-rahi).
Ko te huarahi tinowari ki te rurupahu, ko te whakawhitinga o te kii ki te whakawhānui i te whanui katoa. Na kaore koe e mutu ki te waahi atu ranei, mehemea kei te raru koe kia pai to kuputuhi ki te rohe horahanga. Anei te mahi:
id = "bg" />
- Tuatahi, kia mohio nga kaitirotiro katoa 100% te teitei, 0 nga taapiri, me te 0 nga painga ki nga huānga me te HTML HTML. Tuhia te mea e whai ake nei i te upoko o to tuhinga HTML:
- Tāpirihia te whakapakoko e hiahia ana koe hei papamuri hei waahanga tuatahi o te whārangi tukutuku, ka hoatu ki a ia te id o "bg":
- Whakaritea te ahua papamuri kia whakaritea ai ki runga ma te taha maui, 100% te whanui me te 100% teitei. Tāpirihia tēnei ki tō pepa kāhua:
img # bg {
tūranga: kua whakaritea;
runga: 0;
maui: 0;
whanui: 100%;
teitei: 100%;
} - Tāpirihia ō ihirangi katoa ki te whārangi kei roto o te kaupapa DIV me te ahua o te "ihirangi". Tāpirihia te DIV i raro i te whakapakoko:
Tuhipoka: he mea pai ki te titiro ki to maatau inaianei. Me whakaatu te ahua o te whakaaturanga, engari kua ngaro katoa to korero. He aha? No te mea he 100% te roa o te papamuri, a ko te wehenga ihirangi i muri i te ahua i roto i te rere o te tuhinga - kaore te nuinga o nga kaitoro e whakaatu.Ko nga mea katoa kei konei - tae atu ki nga pane, paraka, me aha atu.
- Whakaritehia to ihirangi kia pai te whanaungatanga me te he -index o 1. Ka kawea mai e tenei ki runga ake i te ahua papamuri i roto i nga kaiwhakarato paerewa-paerewa. Tāpirihia tēnei ki tō pepa kāhua:
#content {
tūranga: whanaunga;
z-index: 1;
}
- Engari kaore i mahia. Ko te Internet Explorer 6 ehara i te paerewa paerewa me te raru tonu. He maha nga huarahi ki te huna i te CSS mai i nga tirotiro katoa, engari IE6, engari ko te mea tinowari (me te kore pea he raruraru atu) ko te whakamahi i nga korero turangi. Whakanohia te whai ake nei i muri i to taatai i te upoko o to tuhinga:
- I roto i te korero kua whakamaramatia, whakaurua tetahi atu momo kāhua me ētahi momo hei tiki IE 6 ki te takaro pai:
- Me tino whakamatau i IE 7 me IE 8. Ka hiahia koe ki te whakatika i nga korero hei tautoko ia ratau. Heoi, i whakamahia e ahau i taku whakamatau i te reira.
OK - kua oti te whakakake tenei. He iti noa nga pae e hiahia ana kia tautoko i te IE 7 me te 8 i muri atu, iti ake te IE6!
I tenei, ko te huarahi nei kaore e tika ana, kaore hoki he mea nui mo koe. Ka waiho e ahau i konei koinei hei tauira mo te matatau ki te nui atu o nga mea uaua i mua i te whakatangitangi pai o o maatau rorohiko katoa!
Whakaritea ana i te Atahanga Papakupu Mahara Atu i te Mokowi iti
Ka taea e koe te whakamahi i tetahi ritenga rite ki te rino i tetahi whakaahua papanga i te taha o tetahi DIV ranei tetahi atu kaupapa i to whārangi tukutuku. He iti noa tenei hei whakamahi koe i te tuuturu rawa, kei te whai take rereke ranei mo etahi atu waahanga o to whaarangi.
- Whakauhia te ahua i runga i te whārangi e hiahia ana ahau ki te whakamahi hei papamuri.
- I roto i te pepa kāhua, whakatūhia he whanui me te tiketike mo te whakapakoko. Tuhipoka, ka taea e koe te whakamahi i nga paenga mo te whanui me te teitei, engari ka kitea hewari atu te whakarite ki nga uara roa mo te teitei.
img # bg {
whanui: 20em;
teitei: 30em;
} - Tuhia to ihirangi ki roto i te div me te "id" ihirangi "i runga ake nei:
Katoa tou ihirangi i konei
- Ko te ahua o te ihirangi kia rite ki te whanui me te teitei rite te ahua papamuri:
div #
whanui: 20em;
teitei: 30em;
} - Na ka tuhia nga ihirangi ki te teitei rite te ahua. Na, ki te 30em te ahua o taau, ka whai ahua koe ki runga: -30em; Kaua e wareware ki te whakauru i te z-index o 1 i runga i te ihirangi.
#content {
tūranga: whanaunga;
runga: -30em;
z-index: 1;
whanui: 20em;
teitei: 30em;
} - Na ka whakaurua ki te z-index o -1 mo nga kaiwhakamahi IE 6, penei i to runga ake:
Ano, me te nui o te rahi o te tautoko o te pouaka whakawhānui kei te awhina i tenei wa, kaore pea he waahanga me te whakaatu mai i tenei waahanga. Mena kua hiahia koe ki te whakamahi i tenei huarahi, me tino mohio ki te whakamatau i tenei i roto i te maha o nga kaituhi ka taea e koe.
A, mehemea he huringa o to tuhinga, me whakarereke i te rahi o to pouaka me to whakaahua taapiri, mehemea kaore koe, ka mutu ki nga hua ke.