Pehea e hoʻouka ai i nā kiʻi iʻikeʻia i kahi pūnaewele

Eia keʻano e hoʻonui ai i nā kiʻi hoʻolālā e pane ana me CSS

E nānā i nā pūnaewele punaewele i kēia mau lā a me hoʻokahi hana hoʻomalu eʻike ponoʻoe i ka nui, nā kiʻi hoʻolālā e nānāʻia. ʻO kekahi o nā ho'āʻo me ka hoʻohuiʻana i kēia mau kiʻi mai ka hana maikaʻi loa e paneʻia e nā pūnaewele i nāʻano likeʻole a me nā'ōnaehana - kahi iʻikeʻia he inoa pūnaewele pane .

Ma muli o ka hoʻololi a me nā kaulike o ka pūnaewele o kāu pūnaewele me nā nui o nā hiʻohiʻona, pēlā nō hoʻi e pono ai i kēia mau kiʻi i hoʻohālikelike i ko lākou nui e like me ia.

ʻO ka meaʻoiaʻiʻo,ʻo kēia mau "fluid images" kekahi o nā kī nui o nā pūnaewele pane mai (me kahi'eneke a me nā nīnau pāpālina). ʻO kēia mau'āpanaʻekolu, he mea nui ia o ka pūnaewele pūnaewele pane mai ka hoʻomakaʻana, akāʻoiai ua maʻalahi ka maʻalahiʻana e hoʻohui i nā kiʻi kikowaena i kahi pūnaewele (nā kiʻiʻenelani nā kiʻi e heluʻia ma keʻano he hapa o ka hōʻailona HTML), e hana ana me nā kiʻi kālai'āina (i kapaʻia i loko o ka palapala me ka hoʻohanaʻana i nā kuleana o CSS) ua lōʻihi loa ka hoʻokūkū nui i nā mea hoʻolālā pūnaewele a me nā mea hana mua. Mahalo,ʻo ka hoʻohuiʻana i ka waiwai "kiʻi-nui" i CSS ua hana i kēia.

I loko o kekahiʻokoʻaʻokoʻa, ua uhi wau i keʻano o ka hoʻohanaʻana i ka waiwai nui o ka CSS3 no ka hoʻolālāʻana i nā kiʻi e komo i ka puka makani, akā,ʻoi aku ka maikaʻi, keʻano maikaʻi e hoʻolālā ai no kēia waiwai. No ka hanaʻana i kēia, e hoʻohana mākou i kēia waiwai a me ka hoʻohui waiwai:

ʻike mua-nui: uhi;

Mālama ka waihona waiwai paʻa i ka polokalamu kelepona e hoʻonui i ke kiʻi e hoʻokomo i ka puka makani, me kaʻole o ka nui a me ka liʻiliʻi paha o ka puka. Hoʻolālāʻia ka kiʻi e uhi i ka uhi a pau, akā, ua mālama paʻaʻia ka pauku a me ka hiʻohiʻona hiʻohiʻona , e pale ana i ka hoʻopunipuniʻole o ke kiʻi.

Hoʻokomoʻia ke kiʻi ma ka puka mata ma ka nui loa i hiki ke hiki ke uhiʻia ka puka o ka puka. Ma kēiaʻano,ʻaʻoleʻoe i nā wahi kikohaka ma kāuʻaoʻao a iʻole kekahi haʻalulu i ke kiʻi, akā,ʻo ia hoʻi keʻano o ka hoʻopiʻiʻiaʻana o kekahi o kēia kiʻi ma muli o ka mahele o ka nānāʻana a me ke kiʻi i nīnauʻia. Eia kekahi laʻana, hiki keʻokiʻia nāʻaoʻao o ke kiʻi (ma luna, lalo, hema, a'ākau paha) ma nā kiʻi, ma muli o nā kumukūʻai āu e hoʻohana ai no ka waiwai kūlana. Ināʻoe e hoʻolālā i ke kumu i ka "lima hema", hiki i kaʻaoʻao ma lalo a me nāʻaoʻaoʻelua ka piʻiʻana o ke kiʻi. Ināʻoe e hoʻolālā i ke kiʻi kumu, e hele mai ka nui mai nāʻaoʻao a pau, akā, no ka hoʻolahaʻiaʻana o kēlā hana, e emi mai ka hopena i kēlā me kēiaʻaoʻao.

Pehea e hoʻohana ai i kaʻikepili-nui: uhi;

I ka hanaʻana i kāu kiʻi kumu, he mea maikaʻi e hana i kahi kiʻi kūpono. ʻOiai e hiki i nā polokalamu kele pūnaewele ke hoʻonui i ke kiʻi me kaʻikeʻole i ka hopena o kaʻike kiʻi, inā e kau ka pūnaewele i kahi kiʻi iʻoi aku ka nui ma mua o kona mau hiʻohiʻona mua, e hoʻohaʻahaʻaʻia kaʻoni o kaʻike, a me ka piholo. ʻO kaʻaoʻao lalo i kēia, aia kāuʻaoʻao e hana i kahi hoʻokūkū i ka wā e hāʻawi anaʻoe i nā kiʻi nui i nā pale a pau.

Ke hanaʻoe i kēia, e hoʻomaopopo i ka hoʻomākaukau ponoʻana i kēlā mau kiʻi no ka loliʻana a me ka lawe pūnaewele . I ka hopena, ponoʻoe eʻimi i ka mea leʻaleʻa ma waena o ka nui a me ka maikaʻi o ka nui o ka nui o ka'ilulu a me ka nui o ka file file no ka wikiwiki hoʻoiho.

ʻO kekahi o nā ala maʻamau e hoʻohana i nā scaling kiʻi kiʻi kahi i makemakeʻoe i kēlā kiʻi e kiʻi i ke kūlana piha o kahiʻaoʻao, inā he whānui ka pepa a nānāʻia ma ka papapihi papapihi a iʻole ka mea liʻiliʻi a hoʻounaʻia i kahi lima hana lima nā lakohana.

Hoʻouna i kāu kiʻi i kāu pūnaewele pūnaewele a hoʻohui i kāu CSS ma keʻano he kiʻi:

kiʻi kiʻi kiʻi: url (fireworks-over-wdw.jpg);
hoʻopilikino-hoʻomanaʻo:ʻaʻole hou;
kahi hope-kahi: ke kikowaena waena;
hoʻonohonoho hope: hoʻopaʻa;

Ho'hui mua i ka polokalamu kelepona CSS mua:

ʻokoʻa-pūnaewele-nui-nui: uhi;
-moz-kūlana-nui: uhi;
-o-kūlana-nui: uhi;

A laila hoʻohui i ka waiwai CSS:

ʻike mua-nui: uhi;

Ke hoʻohanaʻana i nā kiʻi likeʻole e pili ana i nā mea kelepona

ʻOiai he mea nui ka hoʻolālā e pili ana i ka papapihi a iʻole kaʻoihana pona, hiki i ka nui o nā polokalamu ke hiki i ka pūnaewele ke ulu nui, a ua nui ka nui o nā kiʻi nui me ia.

E like me ka mea i'ōlelo muaʻia, e hoʻonohonoho ana i kahi kiʻi kumu nui loa ma luna o kahi'ōpili, no ka laʻanaʻole,ʻaʻole maikaʻi maikaʻi a iʻole ka bandwidth-design design.

E aʻo pehea e hiki ai iāʻoe ke hoʻohana i nā nīnau hulina e lawelawe i nā kiʻi e kūpono i nā polokalamu e hōʻikeʻia ana iā lākou, ae hoʻomaikaʻi hou i kāu pūnaewele me nā pūnaewele pūnaewele.

Ka'ōlelo kumu mua na Jennfier Krynin. Hoʻoponoponoʻia e Jeremy Girard 9/12/17