Maitiro Ekuisa Mifananidzo muHTML

Kugadziridzwa kwekupedzisira: 02/10/2023
Munyori: Sebastian Vidal

Maitiro Ekuisa Mifananidzo muHTML

HTML Mutauro wemarkup iyo inoshandiswa kugadzira uye kugadzirisa zviri mukati peji rewebhu. Chimwe chezvinhu zvakajairika pane peji rewebhu mifananidzo, inogona kushandiswa kukwezva kutarisa kwemushandisi uye kutumira ruzivo rwekuona. zvinobudiriraMunyaya ino, tichadzidza nhanho nhanho se isa mifananidzo muHTML nemazvo uye optimized.

Danho 1: Gadzirira mufananidzo

Danho rekutanga ku nzvimbo mufananidzo muHTML ndiko kuve nechokwadi kuti mufananidzo uri yakagadzirirwa uye yakagadziridzwa zvekushandisa kwako pawebhuIzvi zvinoreva chinja saizi mufananidzo kune saizi yaunoda, dzvanya uremu hwayo hwekukasira kurodha uye nekuichengeta mune yakakodzera fomati senge JPEG kana PNG. Uyezve, zvakakosha kupa chifananidzo zita rinotsanangura kuti rivandudze nzvimbo yaro mumajini ekutsvaga.

Danho rechipiri: Isa iyo label

Zve isa mufananidzo muHTML, tinoshandisa tag . Iyi tag itegi isina chinhu, zvichireva kuti haina tag yekuvhara. Mukati meiyo label, isu tinofanirwa kutsanangura iyo URL yemufananidzo watinoda kuisa mu "src" hunhu. Isu tinokwanisawo kuwedzera mamwe maitiro akadai se "alt" kuti tipe mamwe mavara kana mufananidzo ukasatakura nemazvo, uye "title" kuratidza pop-up meseji kana mushandisi achitenderedza pamusoro pemufananidzo.

Nhanho 3: Taura Saizi Yechifananidzo uye Nzvimbo

Tangoisa tag nemufananidzo URL, tinogona tsanangura saizi nenzvimbo yemufananidzo uchishandisa "upamhi" uye "kureba". Aya hunhu anogamuchira kukosha mumapikseli kana muzana, uye anotibvumira kugadzirisa saizi yemufananidzo zvinoenderana nezvatinoda. Pamusoro pezvo, tinogona kushandisa hunhu hwakadai se "align" kurongedza mufananidzo maererano nemavara, kana "muganhu" kuwedzera muganhu kumufananidzo.

Exclusive content - Click Here  Unoshandisa sei Dynamic Link ine zviri mukati zvinoshanduka?

Nematanho akareruka aya, iwe zvino wava neruzivo rwunodiwa kuti isa mifananidzo muHTML uye uvandudze kutaridzika kwekuona kwemapeji ako ewebhu. Rangarira kugadzirisa saizi uye optimization yemifananidzo kuchengetedza kuita kwakanaka kwekurodha uye usakanganwe kushandisa humwe hunhu kuvandudza kuwanikwa uye kushandiswa kwewebhusaiti yako. Edza uye uunze zvemukati kuti zvive nehupenyu nemifananidzo inoshamisa!

Maitiro ekuwedzera mifananidzo muHTML

Muchidzidzo ichi, tichadzidza kuisa mifananidzo mugwaro reHTML. Kuwedzera mifananidzo ndeye zvinobudirira kuvandudza kutaridzika kwewebhusaiti yako uye kuita kuti iwedzere kukwezva kune vashanyi. Sezvineiwo, HTML inopa chaiwo ma tag ekuisa mifananidzo mupeji rako.

1. Kushandisa img tag

Nzira yakajairika yekuwedzera mifananidzo muHTML kushandisa tag . Kuti uite izvi, iwe unofanirwa kuseta iyo src hunhu inotsanangura iyo URL yemufananidzo waunoda kuratidza. Semuyenzaniso, . Yeuka kuti zvinokurudzirwa kushandisa mafaira emifananidzo mubrowser-inoenderana mafomati, akadai seJPEG kana PNG.

Pamusoro pezvo, iwe unogona kuenderera mberi nekugadzirisa kutaridzika kwechifananidzo uchishandisa humwe hunhu hwakadai sehurefu nehupamhi kuseta saizi yemufananidzo, alt kupa mamwe mavara kana mufananidzo ukatadza kurodha, uye zita rekuwedzera iwo mavara anoratidzwa. paunofamba pamusoro pemufananidzo.

2. Nzira dzefaira uye nzira dze URL

Kana zvasvika pakutsanangura nzira yemufananidzo, iwe unofanirwa kufunga nezvesarudzo mbiri: yenzvimbo faira nzira kana iyo URL nzira. Kana mufananidzo wacho uri pakombiyuta yako uye uchida kuuisa kubva ipapo, unofanira kupa nzira yakazara yefaira, yakadai se "C:imagefolder.jpg." Nekune rumwe rutivi, kana mufananidzo wacho wakatambirwa pawebhusaiti, unofanira kudoma URL yakazara yemufananidzo, se"http://www.example.com/image.jpg."

Exclusive content - Click Here  Ndiani akatanga mutauro weCrystal programming?

Rangarira kuti nzira dze URL dzakanyanya kuwanda, sezvo dzichibvumira webhusaiti yako kurodha mifananidzo kubva kune yekunze server uye kwete kuvimba nemafaira akachengetwa pamushini wemuenzi.

3. Image optimization

Zvakakosha kugadzirisa mifananidzo yako yewebhu usati wavawedzera kune yako HTML peji. Izvi zvinoreva kuderedza saizi yefaira yemifananidzo pasina kukanganisa maitiro avo ekuona. Unogona kushandisa maturusi ekugadzirisa mifananidzo kana online compressors kuti uite izvi. Nekugadzirisa mapikicha, peji rako rinotakura nekukurumidza uye kudzivirira vashanyi kubva mukushushikana nenguva refu yekurodha.

Mukupedzisa, kuwedzera mifananidzo muHTML ibasa riri nyore, asi rinoda kutarisisa zvimwe zvakakosha senge tag chaiyo, iyo faira nzira kana URL uye optimization yemifananidzo kuti ive nechokwadi cheruzivo rwemushandisi. Tevedza mirairo iyi uye iwe unenge uri munzira yekugadzira zvinooneka mapeji ewebhu.

Kukosha kwemavara muHTML

1. Wedzera kuwanikwa kwekuona: Mazita ekunyora muHTML inoita basa rakakosha mukuratidzwa kwemifananidzo pawebhusaiti. Paunenge uchiwedzera mufananidzo kupeji, iyi tegi inoshandiswa kuitaridza nemazvo. Zvisinei, kukosha kwayo kunopfuura kuratidzwa kwakapfava kwekuona. Iwo ma tags Vanobvumira injini dzekutsvaga uye vaverengi vezvidzitiro kududzira zviri pamufananidzo, kuita kuti vanhu vane hurema hwekuona vasvike kana vanoshandisa tekinoroji inobatsira.

2. Kugadzirisa mashandiro: Nokushandisa mavara muHTML nenzira kwayo, unogona kuvandudza zvakanyanya kuita kubva pawebhusaiti Web. Aya ma tag anotendera iwe kuti utaure saizi yemufananidzo, kuderedza kugadzirisa kwayo uye kunyange kuimanikidza, zvichikonzera kukurumidza kurodha peji. Mukuwedzera, maitiro akadai sekutakura ane usimbe anogona kushandiswa, iyo inotakura mifananidzo sezvinodiwa nemushandisi, kuderedza nguva yekutanga yekurodha peji.

Exclusive content - Click Here  Mapurojekiti emitauro yakawanda anogona kushandiswa nePinegrow here?

3. Ruzivo rwakavandudzwa rwemushandisi: Mifananidzo inoita basa rakakosha muchiitiko chemushandisi pane webhusaiti. Nokushandisa mavara nemazvo MuHTML, iwe unogona kupa inooneka inobata uye inowirirana chiitiko. Uyezve, iwe unogona kuwedzera hunhu hwakadai sealt zvinyorwa, izvo zvinopa tsananguro yezvinyorwa zvemufananidzo kune avo vasingazvione. Izvi zvinovandudza kunzwisisa kwezviri mukati uye zvinodzivirira kuvhiringidzika kune vese vashandisi.

Sintax chaiyo yekuisa mifananidzo muHTML

1. Kushandisa chinyorwa

Nzira yakakosha uye yakajairika yekuisa mifananidzo muHTML kushandisa iyo tag . Iyi tag inotibvumira kutsanangura nzvimbo yemufananidzo, saizi yayo uye zvimwe zvivakwa. The tag ine zvinotevera zvinodiwa uye zvekusarudza maitiro:

– src: hunhu uhu hunotsanangura nzira yemufananidzo. Iyi inogona kunge iri URL kana nzira inoenderana yefaira remufananidzo.
– alt: Hunhu uhu hunopa mamwe mavara ekuratidza kana mufananidzo usingakwanisi kurodha nemazvo.
– upamhi: Hunhu uhu hunotsanangudza hupamhi hwemufananidzo mumapikiseli.
– kukwirira: Uhwu hunhu hunotsanangudza hurefu hwemufananidzo mumapikiseli.

Heino muenzaniso wekuti syntax ingaratidzika sei kuisa mufananidzo uchishandisa tag :

«`
Image alt text
«`

2. Kushandisa chinyorwa

Imwe nzira yekuisa mifananidzo muHTML kushandisa tag

Chiratidzo

rinoshandiswa kuunganidza zvinhu zvinechekuita senge mifananidzo nemazwi ayo. Iyi tag inotibatsira kuvandudza kuwanikwa uye semantics yemapeji edu.

Kushandisa label

, tinofanira kuisa mufananidzo mukati mezita racho wobva wawedzera tag
kungano. Heino muenzaniso wekuti syntax ingataridzika sei uchishandisa iyo tag

:

"`html

Image alt text
Image legend

«`

3. Kushandisa CSS kugadzira mifananidzo

Pamusoro pema tag eHTML ataurwa pamusoro, isu tinogona zvakare kushandisa CSS kugadzira mifananidzo yedu. Tinogona kushandisa masitayera akadai semiganhu, mimvuri, opacity, nezvimwe.

Tinogona kushandisa pfuma muganhu Kuwedzera muganhu kumufananidzo, pfuma bhokisi mumvuri kuwedzera mumvuri uye pfuma opacity kugadzirisa opacity yemufananidzo. Heino muenzaniso weiyo CSS syntax yekugadzira mufananidzo ingaite:

"css"
img {
muganhu: 1px yakasimba dema;
bhokisi-mumvuri: 2px 2px 4px rgba(0, 0, 0, 0.8);
opacity: 0.8;
}
«`

Nemaitiro aya, uchakwanisa kuisa uye kugadzirisa mifananidzo mumapeji ako eHTML nenzira kwayo uye nemazvo. Gara uchiyeuka kushandisa alt attribute kupa mamwe mavara, ayo akakosha pakusvikika kwevasingaoni.

Zvinorudziro zvekugadzirisa nzira dzemifananidzo

Kana uchiisa mifananidzo muHTML, zvakakosha kuchengeta iyo faira nzira mupfungwa. Nzira isiriyo inogona kuita kuti mifananidzo isaratidzike zvakanaka pawebhu peji. Kuti udzivise dambudziko iri, Zvinokurudzirwa kushandisa nzira dzinoenderana panzvimbo yenzira dzakakwana.

Imwe nzira inoreva nzvimbo yemufananidzo nekuremekedza HTML faira mauri. Kana zvese zviri zviviri HTML nemufananidzo zviri muforodha imwechete, ingopa zita remufananidzo mune iyo tag yemufananidzo. Kana mufananidzo uri mune imwe folda, madhairekitori akakodzera anofanirwa kushandiswa kusvika pamufananidzo.

Paunenge uchishanda nemaforodha kana madhairekitori, nzira dzinoenderana dzinofanira kushandiswa. Semuyenzaniso, kana ukashandisa imwe nzira "../../../images/image1.jpg" kuti uwane mufananidzo kubva muHTML faira mune imwe folda, unofanira kuramba uchishandisa nzira imwechete mune mamwe ese HTML. mafaira mukati meiyo folda. Izvi zvinozoita kuti chifananidzo chiratidze nenzira kwayo pamapeji ese ewebhu mune iro dhairekitori. Gara uchiyeuka kutarisa nzira uye tarisa kuti mifananidzo iri kurodha nemazvo usati waburitsa webhusaiti.

Saizi mifananidzo muHTML

MuHTML, gadzirisa saizi yemufananidzo Iro ibasa rakakosha kuve nechokwadi chechokwadi chemushandisi ruzivo. Sezvineiwo, kune akati wandei akapusa uye anoshanda nzira dzekuzadzisa chinangwa ichi. Nzira yakajairika yekudzora saizi yemifananidzo muHTML ndeye kushandisa "hupamhi" hunhu mukati meiyo tag yemufananidzo. Semuenzaniso, kana iwe uchida kuseta hupamhi kubva pamufananidzo pa 300 pixels, unogona kungowedzera mutsara unotevera wekodhi kune yako tag yemufananidzo: upamhi="300".

Imwe nzira yekugadzirisa saizi yemifananidzo ndeye kushandisa "hurefu" hunhu pachinzvimbo che "hupamhi." Zvakafanana nemuenzaniso wapfuura, unogona kuseta kureba kwechifananidzo kusvika mazana maviri pixels nekuwedzera mutsara unotevera wekodhi kune tag yemufananidzo: kureba=”200″. Ziva kuti kudoma humwe chete hweaya hunhu hunogona kukonzera kukanganisa kwemufananidzo, saka zvinokurudzirwa kushandisa ese maviri hunhu kuchengetedza chiyero chakakodzera.

Kana iwe uchida kutonga kwakawanda pamusoro pehukuru uye kuronga kwemifananidzo, unogona zvakare kushandisa CSS musanganiswa neHTML. Semuenzaniso, unogona kugadzira yakasarudzika CSS masitayipi inotsanangura zviyero zvinodiwa zvemifananidzo uye wozoisa kune inoenderana tag yemifananidzo. Izvi zvinokutendera kuti ugadzirise saizi yemifananidzo zviri nyore mukati mepeji yako yese yewebhu pasina kutsanangura wega "hupamhi" kana "hurefu" mune yega tag yemufananidzo. Ingo wedzera mutsara unotevera wekodhi muchikamu chako