Yang'anani pa tsamba lililonse la webusaiti ndipo mudzawona kuphatikiza malemba ndi zithunzi. Zonsezi ndizofunikira kwambiri pa webusaitiyi. Mauthenga olembedwa ndi malo omwe alendo angayambe kuwerenga ndi injini zomwe adzazigwiritsa ntchito monga gawo lawo. Zithunzi zidzawonjezera chidwi chowunikira pa tsamba ndi chithandizo ndikuwongolera malembawo.
Kuwonjezera malemba ndi zithunzi pa webusaiti ndi zophweka. Malembo akuwonjezeka ndi ma HTML omwe ali ngati ndime, mutu, ndi mndandanda, pomwe zithunzi zikuikidwa pa tsamba ndi chinthu. Mukadawonjezerapo fano ku tsamba lanu la webusaiti, mungafune kuti lembalo likuyendere pafupi ndi fano, m'malo mofanana pansipa (yomwe ili njira yosasinthika chithunzi chomwe chawonjezeredwa ku HTML yanu chidzaperekedwe mu msakatuli). Mwachidziwitso, pali njira ziwiri zomwe mungathe kukwaniritsira mawonekedwe anu, pogwiritsira ntchito CSS (kutchulidwa) kapena powonjezera mawonedwe owonetsera mwa HTML (osakondweretsedwa, popeza mukufuna kupatulira kalembedwe ndi kapangidwe ka webusaiti yanu).
Kugwiritsa ntchito CSS
Njira yolondola yosintha momwe masamba ndi zithunzi zimakhalira ndi momwe maonekedwe awo akuwonetsera amaonekera mu osatsegula ali ndi CSS . Kumbukirani, popeza tikukamba za kusintha kwa masomphenya pa tsamba (kupanga mau akuzungulira kuzungulira fano), izi zikutanthauza kuti ndilo gawo la Mapepala Otsegula.
- Choyamba, onjezani chithunzi chanu patsamba lanu la intaneti. Kumbukirani kuti musatengere makhalidwe amodzi (monga kukula ndi kutalika kwabwino) kuchokera ku HTML. Izi ndizofunikira, makamaka pa webusaiti yamvetsera komwe kukula kwazithunzi kumasiyanasiyana malinga ndi osatsegula. Mapulogalamu ena, monga Adobe Dreamweaver, adzawonjezera kukula ndi kutalika kwa chidziwitso kwa mafano omwe alowetsedwa ndi chida chimenecho, kotero onetsetsani kuti kuchotsa chidziwitso ichi kuchokera ku HTML code! Onetsetsani, komabe, kuphatikizapo malemba okwanira . Pano pali chitsanzo cha momwe HTML yanu ikhoza kuyang'ana:
-
- Kwa makongoletsedwe, mukhoza kuwonjezera kalasi ku fano. Gulu ili ndilofunika ndi zomwe tidzagwiritsa ntchito mu fayilo lathu la CSS. Onani kuti phindu limene timagwiritsa ntchito pano ndi losavuta, ngakhale, chifukwa cha kachitidwe kameneka, timakonda kugwiritsira ntchito mfundo za "kumanzere" kapena "kulondola", malingana ndi njira yomwe tikufunira kuti fano lathu lifanane. Timapeza mawu omveka bwino ogwira ntchito bwino ndikukhala ophweka kwa ena omwe angafunikire kusunga malo m'tsogolomu kuti amvetse, koma mungapereke izi zilizonse zomwe mukuzifuna.
-
- Pokhapokha, gululi likuyamikira sichidzachita chilichonse. Chithunzicho sichidzangowonjezera kumanzere kwa mawuwo. Kwa ichi, ife tsopano tikuyenera kutembenukira ku fayilo lathu la CSS.
-
- M'masewero anu, tsopano mukhoza kuwonjezera ndondomeko iyi:
- .left {
- sungunulani: kumanzere;
- padding: 0 20px 20px 0;
- }}
- Zimene mwachita apa ndizogwiritsa ntchito katundu wa CSS "woyandama" , womwe ungakoke chithunzichi kuchokera pamtundu woyenera (momwe chithunzicho chimawonetsera, pamodzi ndi mawu omwe ali pansi pake) ndipo chidzagwirizanitsa kumbali ya kumanzere kwa chidebe chake . Malemba omwe amachokera pambuyo pake mu kuyika kwa HTML ndipo tsopano ayambe kuzungulira. Tinaonjezeranso zinthu zina zamtengo wapatali kuti mawuwa asapangidwe motsutsana ndi chithunzichi. M'malo mwake, idzakhala ndi malo ena abwino omwe angakhale okongola pa tsamba la mapepala. Mu CSS shorthand for padding, tawonjezera 0 makhalidwe pamwamba ndi kumanzere kwa chithunzi, ndi pixel 20 kumanzere ndi pansi. Kumbukirani, muyenera kuwonjezera papepala lamanja la chithunzi chotsalira. Chithunzi chogwirizana chogwirizana (chomwe tidzakayang'ana mu mphindi) chikanakhala ndi padding yomwe imagwiritsidwa ntchito kumbali yake yamanzere.
- Ngati muwona tsamba lanu la webusaiti mumsakatuli, muyenera tsopano kuona kuti fano lanu likugwirizana ndi mbali ya kumanzere kwa tsamba ndipo mawuwo akuwombera bwino. Njira ina yonena izi ndikuti fano "limayendetsedwa kumanzere".
- Ngati mukufuna kusintha chithunzichi kuti chikhale choyenera (monga chithunzi chomwe chikutsatira nkhaniyi), zikanakhala zophweka. Choyamba, muyenera kuonetsetsa kuti, kuwonjezera pa kalembedwe yomwe tangowonjezerapo CSS yathu kufunika kwa kalasi ya "kumanzere", ifenso tiri nayo imodzi yolumikiza molondola. Zikuwoneka ngati izi:
- .wow {
- sungunulani: kumanja;
- padding: 0 0 20px 20px;
- }}
- Mukhoza kuona kuti izi ziri zofanana ndi CSS yoyamba yomwe talemba. Kusiyana kokha ndi mtengo umene timagwiritsa ntchito pa katundu "woyandama" ndi zinthu zomwe timagwiritsa ntchito (kuwonjezera ena kumbali ya kumanzere kwa fano lathu m'malo moyenera).
- Potsiriza, mutasintha mtengo wa kalasiyo kuchokera "kumanzere" kupita "kumanja" mu HTML yanu:
-
- Tayang'anani pa tsamba lanu mu osatsegula tsopano ndipo chithunzi chanu chiyenera kukhala chophatikizidwa kumanja ndi kulembedwa mwaluso pozungulira. Timakonda kuwonjezera mawindo onsewa, "otsala" ndi "olondola" ku mafilimu athu onse kuti tigwiritse ntchito mafashoni awa ngati tikufunikira kupanga mapepala. Miyendo iwiriyi imakhala yabwino, zinthu zomwe zingatheke kusinthika zomwe tingathe kutembenukira kulikonse pamene tikufunikira kujambula zithunzi pogwiritsa ntchito malemba ozungulira.
Kugwiritsa ntchito HTML mmalo mwa CSS (ndi chifukwa chiyani mukuyenera & # 39; t)
Ngakhale kuti n'zotheka kulemberana malemba kuzungulira fano ndi HTML, ma intaneti amayenera kuti CSS (ndi ndondomeko zotchulidwa pamwambapa) ndi njira yopitira kuti tithe kusunga kusiyana kwa chikhalidwe (HTML) ndi kalembedwe (CSS). Izi ndi zofunika makamaka mukaganizira zimenezo, pazinthu zina ndi zida zina, malembawo sangafunike kuzungulira fanoli. Kwa zojambula zing'onozing'ono, makonzedwe a webusaiti yovomerezeka angafunike kuti malembawo agwirizane pansi pa fanolo ndi kuti fanolo limatambasula m'kati mwake. Izi zimachitika mosavuta ndi mafunso a mauthenga ngati mafayilo anu ali osiyana ndi ma HTML anu. M'dziko lamakono lamakono, pomwe zithunzi ndi malemba adzawonekera mosiyana kwa alendo osiyanasiyana komanso pawunikira zosiyana, kugawidwa kumeneku ndikofunikira kuti pakhale nthawi yayitali yopambana ndi kuyang'anira tsamba la intaneti.