Conas Méid Íomhá a Athrú i HTML

Nuashonrú deireanach: 13/07/2023

Sa domhan digiteach, tá ról ríthábhachtach ag dearadh gréasáin maidir le heolas atá tarraingteach ó thaobh amhairc de agus intuigthe a chur i láthair. Ceann de na teicnící bunúsacha chun é seo a bhaint amach ná úsáid a bhaint as íomhánna, ar féidir leo teachtaireachtaí cumhachtacha a tharchur agus aird an úsáideora a ghabháil. Mar sin féin, tá sé riachtanach a thuiscint conas na híomhánna seo a ionramháil chun freastal ar ár sainriachtanais. San Airteagal seo, déanfaimid iniúchadh mionsonraithe ar conas an méid a athrú d'íomhá in HTML, na huirlisí riachtanacha a sholáthar d’fhorbróirí chun cur i láthair éifeachtach amhairc a bhaint amach ina dtionscadail ghréasáin. Gheobhaidh muid amach na príomh-theicnící agus tréithe nach mór a úsáid go rathúil chun torthaí beachta agus tarraingteach a fháil.

1. Réamhrá ar ionramháil méid íomhá i HTML

Nuair a thagann sé chun íomhánna a thaispeáint ar suíomh Gréasáin, is minic is gá a mhéid a choigeartú chun leagan amach an leathanaigh a oiriúnú níos fearr. In HTML, is féidir linn méid na n-íomhánna a ionramháil go héasca agus úsáid á baint as an gclib “img” agus roinnt tréithe sonracha. Is é an tréith leithead is tábhachtaí maidir le híomhá a athrú., a shainíonn leithead na híomhá i bpicteilín nó céatadán de leithead a choimeádáin.

Ábhar eisiach - Cliceáil Anseo  Conas an accent a chur ar ríomhaire glúine HP

Chun íomhá a athrú i HTML, ní gá dúinn ach an tréith “leithead” a chur leis an gclib “img” agus an luach inmhianaithe a shocrú. Mar shampla, má theastaíonn uainn go mbeadh leithead 300 picteilín ag íomhá, is féidir linn an cód seo a leanas a úsáid:

"`html

"`

Chomh maith leis an tréith "leithead", is féidir linn an tréith "airde" a úsáid freisin chun airde na híomhá a shainiú. Mar sin féin, tá sé tábhachtach a thabhairt faoi deara go Tá sé inmholta gan ach ceann amháin de na tréithe seo a shonrú (b'fhearr "leithead"), toisc gur féidir le socrú an dá cheann cóimheas gné na híomhá a shaobhadh.

Más mian linn go n-oirfeadh an íomhá go huathoibríoch leithead a choimeádáin, is féidir linn an luach "100%" a úsáid don tréith "leithead". Cuirfidh sé seo faoi deara an íomhá a athrú go huathoibríoch bunaithe ar an méid atá ar fáil. Mar shampla:

"`html

"`

Go hachomair, is próiseas simplí agus ilúsáideach é méideanna íomhá a ionramháil in HTML. Tríd an tréith “leithead” a chur leis an gclib “img”, is féidir linn méid ár n-íomhánna a rialú go héasca i bpicteilíní nó i gcéatadáin. Cuimhnigh go Tá sé tábhachtach an cion bunaidh den íomhá a choinneáil nuair a bhíonn a mhéid á choigeartú agus is féidir linn an luach "100%" a úsáid freisin ionas go n-oireann an íomhá go huathoibríoch leithead a choimeádáin.

Ábhar eisiach - Cliceáil Anseo  Conas Gach Airm a Fháil in Ard-Mhéara Luigi 3

2. Comhréir bhunúsach chun íomhá a athrú i HTML

Chun íomhá a athrú i HTML, ní mór duit an chlib ```agus na tréithe `leithead` agus `airde`. Ligeann na tréithe seo duit toisí na híomhá a shocrú i bpicteilíní. Mar shampla, más mian linn go mbeadh leithead 400 picteilín ag íomhá agus airde 300 picteilín, is féidir linn na tréithe seo a leanas a chur leis an gclib ```:`leithead=»400″` agus `airde=»300″`.

Tá sé tábhachtach a thabhairt faoi deara gur féidir le méid íomhá a athrú ar an mbealach seo tionchar a imirt ar a cháilíocht. Mar sin, moltar íomhánna ardtaifigh a úsáid agus iad a bharrfheabhsú roimh iad a athrú. Is féidir freisin comhréir bhunaidh na híomhá a choinneáil ach ceann amháin de na tréithe `leithead` nó `airde` a shocrú, agus ligean don cheann eile a choigeartú go comhréireach. Chun seo a dhéanamh, is féidir leat an aitreabúid `stíl` a úsáid leis an luach `» max-width: 100%; airde: uathoibríoch;»`. Cinnteoidh sé seo go n-oireann an íomhá don leithead uasta atá ar fáil, agus fós a chóimheas gné bunaidh a choinneáil.

Ábhar eisiach - Cliceáil Anseo  Conas a bheidh a fhios agam an bhfuil bac orm ó WhatsApp

Chomh maith leis na tréithe `leithead` agus `airde`, soláthraíonn HTML roghanna eile freisin chun íomhá a athrú. Mar shampla, is féidir leat an chlib `

` i gcomhcheangal leis an gclib `` chun teideal tuairisciúil a chur leis an íomhá. Is féidir leat CSS a úsáid freisin chun stíliú breise a chur i bhfeidhm ar an íomhá, mar shampla éifeachtaí trasdula a chur leis nó méid na híomhá a choigeartú gairis éagsúla. Sna cásanna seo, moltar na hairíonna cuí CSS a úsáid, mar shampla `uas-leithead`, `uas-airde` agus `object-fit`, chun a chinntiú go n-athraítear méid na híomhá i gceart i gcásanna éagsúla.

3. An aitreabúid “leithead” a úsáid chun leithead íomhá in HTML a choigeartú

Is uirlis úsáideach é an tréith leithead in HTML chun leithead íomhá ar leathanach gréasáin a choigeartú. Leis an tréith seo, is féidir leat gné chothrománach íomhá a rialú go sonrach agus a chinntiú go n-oireann sé go foirfe do dhearadh do shuíomh.

Chun an tréith “leithead” a úsáid, níl ort ach é a chur taobh istigh den chlib íomhá. Mar shampla, más mian leat íomhá a bheith 300 picteilín ar leithead, bheadh ​​an cód .

Tá sé tábhachtach a thabhairt faoi deara go bhfuil luach an aitreabúid leithead sonraithe i bpicteilíní. Mar sin féin, is féidir leat céatadán a úsáid freisin chun leithead coibhneasta íomhá a choigeartú i ndáil lena coimeádán. Mar shampla, má shocraíonn tú leithead = ”50%”, tógfaidh an íomhá leath leithead an choimeádáin ina bhfuil sé.

Más mian leat leithead íomhá a choigeartú go comhréireach, déan cinnte nach sonróidh tú airde an íomhá. Mura gcoigeartóidh tú ach an leithead agus ní an airde, athrófar méid an íomhá go huathoibríoch gan warping, ag coinneáil a comhréir bhunaidh. Tá sé seo úsáideach go háirithe nuair a bhíonn tú ag obair le híomhánna sofhreagracha ar gá iad a oiriúnú do mhéideanna scáileáin éagsúla.

4. Coigeartú airde íomhá i HTML ag baint úsáide as an aitreabúid "airde".

Agus íomhánna á n-áirítear ar leathanach gréasáin, is minic is gá an airde a choigeartú chun struchtúr an dearadh a fheistiú. I HTML, is féidir é seo a bhaint amach go héasca ag baint úsáide as an tréith "airde". Anseo taispeánfaimid duit conas é a dhéanamh céim ar chéim:

1. Ar dtús, caithfidh tú an chlib íomhá a bheith i do chód HTML:
"`html
Cur síos ar an íomhá
"`

2. Chun airde na híomhá a choigeartú, níl le déanamh ach an tréith “airde” a chur taobh istigh den chlib íomhá. Is féidir leat an airde atá ag teastáil a shonrú i bpicteilíní nó i gcéatadán. Mar shampla, más mian leat airde 200 picteilín a shocrú, beidh cuma mar seo ar do chlib íomhá:
"`html
Cur síos ar an íomhá
"`
Nó más fearr leat céatadán a úsáid, is féidir leat é a dhéanamh mar a leanas:
"`html
Cur síos ar an íomhá
"`

3. Tá sé tábhachtach a lua, nuair a bhíonn airde íomhá á choigeartú, ní mór duit an cion a chur san áireamh chun é a sheachaint ag breathnú as a riocht. Mura shocraigh tú ach an airde gan an leithead a athrú go comhréireach, féadfaidh an íomhá a bheith le feiceáil sínte nó comhbhrúite.

Cuimhnigh go dtugann an tréith "airde" i HTML an tsolúbthacht duit chun airde íomhá a choigeartú go héasca de réir do riachtanais dearaidh. Trí na céimeanna seo a leanúint, beidh tú in ann cuma amhairc do chuid íomhánna a rialú go héifeachtach agus eispéireas úsáideora is fearr a chinntiú.

5. Comhréir na híomhá a choinneáil agus í a athrú in HTML

Tá roinnt bealaí ann chun comhréir na híomhá a choinneáil agus é a athrú i HTML. Anseo thíos beidh réiteach céim ar chéim ag baint úsáide as HTML agus CSS.

1. Úsáid an aitreabúid “leithead” sa chlib ``: Seo é an bealach is fusa le comhréir íomhá a choinneáil agus í á athrú. Ní mór dúinn ach an leithead atá ag teastáil don íomhá a shocrú ag baint úsáide as an tréith "leithead" agus coigeartóidh an airde go huathoibríoch, ag coinneáil an chomhréir bhunaidh. Seo sampla:

"`html
Mo íomhá
"`

2. Bain úsáid as CSS chun leithead agus airde na híomhá a shocrú: Más mian linn smacht níos mó a bheith againn ar thoisí na híomhá, is féidir linn CSS a úsáid. Chun seo a dhéanamh, ní mór dúinn ach an rang comhfhreagrach a shannadh don íomhá agus ansin an leithead agus an airde sa stílbhileog a shainiú. Seo sampla:

"`html

Mo íomhá
"`

3. Bain úsáid as an aitreabúid «stíl» sa chlib ``: Rogha eile is ea an tréith "stíl" a úsáid go díreach sa chlib `` leithead agus airde na híomhá a shocrú. Seo sampla:

"`html
Mo íomhá
"`

Seo cuid de na bealaí is coitianta chun comhréir íomhá a choinneáil agus í a athrú i HTML. Is féidir leat aon cheann de na roghanna seo a úsáid ag brath ar do chuid riachtanas agus sainroghanna. Cuimhnigh i gcónaí na toisí a thástáil agus a choigeartú chun an toradh inmhianaithe a fháil.

6. Íomhá a athrú le luachanna coibhneasta in HTML

Chun íomhá a athrú in HTML ag baint úsáide as luachanna coibhneasta, is féidir linn an t-airí CSS "leithead" a úsáid. Ligeann an mhaoin seo dúinn leithead an íomhá a shonrú i gcéatadán maidir le méid an choimeádáin. Mar shampla, más mian linn go dtógfaidh an íomhá leath den choimeádán, is féidir linn "leithead: 50%" a úsáid i stíl CSS den chlib íomhá.

Bealach eile chun méid na híomhá a athrú ná an t-airí CSS “uasleithead” a úsáid. Ligeann an t-airí seo dúinn uasmhéid a shonrú don íomhá, ag cinntiú nach bhfuil cuma picteilín nó saobhadh uirthi ar scáileáin níos mó. Is féidir linn "max-width: 100%" a úsáid ionas go n-oireann an íomhá méid an choimeádáin, ach gan dul thar a mhéid bunaidh.

Tá sé tábhachtach a thabhairt faoi deara, nuair a bhíonn íomhá á athrú ag baint úsáide as luachanna coibhneasta, is gá freisin airde na híomhá a choigeartú go comhréireach chun a comhréir bhunaidh a choinneáil. Chun seo, is féidir linn an mhaoin CSS "airde" a úsáid mar aon le "leithead" nó "uas-leithead". Mar shampla, más mian linn an íomhá a chóimheas gné bunaidh a choinneáil, is féidir linn "airde: uathoibríoch" a úsáid i stíl CSS den chlib íomhá. Cinnteoidh sé seo go gcoigeartóidh an airde go huathoibríoch go comhréireach leis an leithead sonraithe.

7. Méid íomhá a rialú le luachanna absalóideacha in HTML

Bealach amháin chun méid íomhá i HTML a rialú ná trí luachanna absalóideacha a úsáid. Ceadaíonn na luachanna seo duit tomhas seasta a shonrú le haghaidh airde agus leithead na híomhá, beag beann ar mhéid an chomhaid bhunaidh.

Chun seo a dhéanamh, is féidir leat an chlib a úsáid HTML agus úsáid na tréithe leithead agus airde chun na luachanna absalóideacha atá ag teastáil a shonrú. Mar shampla, más mian leat go mbeadh leithead 300 picteilín ag an íomhá agus airde 200 picteilín, is féidir leat an cód seo a leanas a chur san áireamh:

"`html
Cur síos ar an íomhá
"`

Tá sé tábhachtach a thabhairt faoi deara, agus luachanna absalóideacha á n-úsáid, go bhféadfadh an íomhá a bheith saobhadh nó picteilínithe má athraítear méid an fhuinneog brabhsálaí. Tá sé seo toisc nach n-oiriúnaíonn an íomhá go dinimiciúil do mhéideanna scáileáin éagsúla.

Rogha eile a mholtar ná luachanna coibhneasta a úsáid in ionad na cinn iomlána. Mar shampla, in ionad an méid a shonrú i bpicteilíní, is féidir leat céatadáin a úsáid chun an íomhá a fheistiú go huathoibríoch don spás atá ar fáil. ar an scáileán. Baintear é seo amach trí luachanna céatadáin a shannadh do na tréithe leithead agus airde.

"`html
Cur síos ar an íomhá
"`

Trí úsáid a bhaint as luachanna coibhneasta, déanfar an íomhá a scála go comhréireach le méid na fuinneoige brabhsálaí, rud a fhágann go mbeidh taithí féachana níos fearr ann Do na húsáideoirí. Mar sin féin, tá sé tábhachtach a thabhairt faoi deara go bhfuil sé riachtanach i gcásanna áirithe luachanna absalóideach agus coibhneasta a chur le chéile chun an toradh inmhianaithe a fháil.

Go hachomair, is rogha bhailí é méid íomhá le luachanna absalóideacha in HTML a rialú, ach tá sé tábhachtach na teorainneacha a bhaineann le hinoiriúnaitheacht do mhéideanna scáileáin éagsúla a mheas. Is féidir le húsáid luachanna coibhneasta réiteach níos solúbtha agus inoiriúnaithe a sholáthar.

8. Aonaid speisialta tomhais a úsáid chun méid íomhá HTML a choigeartú

Tá ról ríthábhachtach ag aonaid tomhais nuair a dhéantar méid íomhá a athrú i HTML. Chomh maith le haonaid choitianta tomhais cosúil le picteilíní, céatadáin, agus pointí, cuireann HTML aonaid tomhais speisialta ar fáil freisin a sholáthraíonn solúbthacht agus smacht níos mó ar mhéid íomhá.

Ceann de na haonaid speisialta tomhais is coitianta a úsáidtear ná an t-aonad “em”, atá bunaithe ar an gclómhéid reatha. Trí mhéid íomhá a shocrú go "em", déanfar an íomhá a choigeartú go huathoibríoch má athraítear an clómhéid sa doiciméad HTML. Mar shampla, má shocraíonn tú méid íomhá go 2em agus ansin an clómhéid a mhéadú ar fud an doiciméid, déanfar an íomhá a dhúbailt go comhréireach.

Aonad tomhais speisialta úsáideach eile is ea "rem," atá difriúil ó "em" sa mhéid is go bhfuil sé bunaithe ar bhunmhéid an doiciméid seachas ar an gclómhéid reatha. Ligeann sé seo smacht agus comhsheasmhacht níos fearr maidir le híomhánna a fheistiú i gcodanna éagsúla den doiciméad. Mar shampla, má shocraíonn tú méid íomhá go 1.5rem, beidh a méid 1.5 uair níos mó ná bunmhéid an chló.

Chomh maith leis na haonaid tomhais speisialta seo, soláthraíonn HTML roghanna eile freisin, mar shampla an t-aonad "vw" atá bunaithe ar leithead na fuinneoige brabhsálaí, an t-aonad "vh" atá bunaithe ar airde na fuinneoige brabhsálaí, agus an t-aonad “vmin” atá bunaithe ar an luach íosta idir leithead agus airde fhuinneog an bhrabhsálaí. Tá na haonaid seo an-úsáideach chun leagan amach sofhreagrach a chruthú agus chun a chinntiú go n-oireann íomhánna i gceart ar mhéideanna éagsúla scáileáin.

I mbeagán focal, trí úsáid a bhaint as aonaid tomhais speisialta mar "em", "rem", "vw", "vh" agus "vmin" chun íomhá a mhéid i HTML, gheobhaidh tú níos mó smachta agus solúbthachta. Ceadaíonn na haonaid seo íomhánna a choigeartú go huathoibríoch bunaithe ar fhachtóirí éagsúla, mar shampla clómhéid, méid fuinneoige an bhrabhsálaí, agus an cineál feiste a úsáidtear. Déan triail leis na haonaid seo agus faigh amach conas an feistiú foirfe a fháil do d’íomhánna i do thionscadail de HTML.

9. Athraigh méid íomhá i HTML ag úsáid stíleanna CSS

Chun íomhá a athrú i HTML le stíleanna CSS, tá roinnt céimeanna simplí le leanúint. Ar an gcéad dul síos, ní mór duit an íomhá a bhfuil tú ag iarraidh an t-athrú méid a chur i bhfeidhm a aithint. seo is féidir é a dhéanamh ag baint úsáide as an aitreabúid HTML "id" nó "aicme" chun é a roghnú go beacht. Nuair a aithnítear an íomhá, cuirtear stíleanna CSS i bhfeidhm chun a méid a mhodhnú.

Bealach coitianta chun íomhá a athrú is ea airíonna leithead agus airde CSS a úsáid. Ceadaíonn na hairíonna seo duit leithead agus airde na híomhá a shonrú faoi seach. Mar shampla, más mian leat méid íomhá a laghdú faoi leath, is féidir leat luach 50% a shocrú don dá mhaoin. Ar an láimh eile, más mian leat méid na híomhá a mhéadú, is féidir leat luach níos mó ná 100% a úsáid.

Chomh maith le méid a athrú go comhréireach, is féidir freisin méid an íomhá a choigeartú go neamhspleách le haghaidh leithead agus airde. Baintear é seo amach trí mhodhnú ach an mhaoin atá ag teastáil, bíodh sé "leithead" don leithead nó "airde" don airde. Tá sé tábhachtach a thabhairt faoi deara, mura ndéantar ach ceann amháin de na hairíonna a mhodhnú, go bhféadfadh an íomhá a comhréir bhunaidh a chailleadh, mar sin moltar an cineál seo a athrú go cúramach. Cuimhnigh i gcónaí do chuid athruithe a shábháil agus seiceáil an chuma atá ar an íomhá ar mhéideanna éagsúla scáileáin.

10. Ard-éifeachtaí méid a athrú a chur i bhfeidhm ar íomhá i HTML

San Airteagal seo, déanfaimid iniúchadh ar conas ard-éifeachtaí méid a athrú a chur i bhfeidhm ar íomhá ag baint úsáide as HTML. Teicníc is ea athrú méid íomhá a úsáidtear go coitianta i bhforbairt gréasáin chun méid agus cuma na n-íomhánna a choigeartú bunaithe ar riachtanais dearaidh. Foghlaimeoimid conas é seo a bhaint amach go héifeachtach agus go gairmiúil.

Seo roinnt céimeanna bunúsacha chun ard-éifeachtaí méid a athrú a chur i bhfeidhm Íosluchtaigh íomhá i HTML:

1. Úsáid an chlib HTML “img” chun an íomhá a leabú i do leathanach gréasáin. Déan cinnte an tréith “src” a sholáthar a léiríonn suíomh na híomhá ar do fhreastalaí. Mar shampla,

2. Chun an íomhá a athrú, is féidir leat an tréith "leithead" agus "airde" a úsáid sa chlib íomhá. Mar shampla, chun leithead 300 picteilín agus airde 200 picteilín a shocrú, is féidir leat leithead = ”300″ height =”200″ a chur leis an gcód chlib íomhá.

3. Is éifeacht méide níos airde is féidir a chur i bhfeidhm ná athrú méide comhréireach. Is éard atá i gceist leis seo ná an leithead nó an luach airde a shocrú agus an luach eile a choigeartú go huathoibríoch chun bunchóimheas gné na híomhá a choinneáil. Is féidir leat é seo a bhaint amach ach an tréith "leithead" nó "airde" a shocrú agus ligean don tréith eile a choigeartú go huathoibríoch. Mar shampla, Coigeartóidh sé airde go huathoibríoch chun an cóimheas gné bunaidh den íomhá a choinneáil.

Cuimhnigh, le do thoil, go bhféadfadh tionchar a bheith ag athrú méid na n-íomhánna ar cháilíocht amhairc na n-íomhánna. Tá sé tábhachtach cothromaíocht a choinneáil idir méid agus cáilíocht na híomhá chun a chinntiú go lódálann do leathanach gréasáin go tapa agus go soláthraíonn sé dea-eispéireas úsáideora. Déan turgnamh le méideanna agus comhréireanna éagsúla chun an chumraíocht is fearr a oireann do do chuid riachtanas a fháil. Leis na céimeanna agus na leideanna seo, beidh tú ar do bhealach chun ard-éifeachtaí méid a athrú a chur i bhfeidhm ar d'íomhánna HTML.

11. Conas íomhá chúlra a athrú i HTML

Agus leathanach gréasáin á dhearadh, d’fhéadfadh go mbeadh gá leis athraigh méid íomhá cúlra in HTML chun é a chur in oiriúint do dhearadh an leathanaigh. Go fortunately, tá an próiseas seo simplí go leor agus is féidir é a chur i gcrích i roinnt céimeanna. Ansin, taispeánfaidh mé duit conas is féidir leat íomhá cúlra a athrú i HTML.

1. Is é an chéad chéim chun íomhá chúlra a athrú in HTML ná stíl CSS na rannóige nó na heiliminte inar mian leat an íomhá a chur i bhfeidhm a shainiú. Chun seo a dhéanamh, ní mór duit an t-airí CSS "íomhá chúlra" a úsáid agus URL na híomhá is mian leat a úsáid mar chúlra a shannadh dó.

2. Nuair a bheidh an stíl CSS sainithe agat don rannóg, tá sé in am toisí chúlra na híomhá a shonrú. Chun seo a dhéanamh, bain úsáid as an airí CSS "méid chúlra" agus sonraigh an leithead agus an airde atá ag teastáil. Is féidir leat aonaid tomhais choibhneasta a úsáid, amhail céatadán nó amharc-amharc, nó aonaid tomhais absalóideacha, amhail picteilíní.

3. Chomh maith le toisí chúlra na híomhá a shonrú, is féidir leat suíomh an chúlra a rialú freisin ag baint úsáide as an airí CSS "suíomh an chúlra". Ceadaíonn an mhaoin seo duit suíomh cothrománach agus ingearach an chúlra sa chuid a shocrú. Is féidir leat luachanna a úsáid i bpicteilíní, céatadáin nó eochairfhocail ar nós "clé", "deas", "barr" nó "bun".

Cuimhnigh go bhfuil sé tábhachtach toisí agus suíomh chúlra na híomhá a thástáil agus a choigeartú chun an toradh inmhianaithe a bhaint amach. Thig leat triail a bhaint as luachanna éagsúla agus féachaint conas a fhéachann siad ar do láithreán gréasáin! Leis na céimeanna simplí seo, is féidir leat íomhá chúlra HTML a athrú go héasca agus é a oiriúnú do do dhearadh gréasáin.

12. Fadhbanna coitianta a réiteach agus méid íomhá á athrú in HTML

Nuair a dhéantar méid íomhá a athrú i HTML, is minic a thagann saincheisteanna coitianta chun cinn a chuireann isteach ar chuma amhairc agus ar fheidhmiúlacht do shuíomh Gréasáin. Go fortunately, is féidir na fadhbanna seo a réiteach trí roinnt céimeanna a leanúint agus úsáid a bhaint as uirlisí agus teicnící éagsúla. Seo treoir mhionsonraithe chun cabhrú leat na fadhbanna seo a réiteach:

1. Seiceáil méid bunaidh na híomhá: Roimh íomhá a athrú, tá sé tábhachtach go mbeadh a fhios agat a méid bunaidh. Is féidir leat é seo a dhéanamh ag baint úsáide as an uirlis iniúchta eilimint i do bhrabhsálaí gréasáin. Nuair a bheidh leithead agus airde na híomhá sainaitheanta agat, is féidir leat a chinneadh cén méid is mian leat a choigeartú.

2. Úsáid an aitreabúid “leithead” agus “airde” ar an lipéad : Chun íomhá a athrú i HTML, is féidir leat na tréithe "leithead" agus "airde" sa chlib a úsáid . Ligeann na tréithe seo duit leithead agus airde na híomhá a shocrú i bpicteilíní. Mar shampla: . Cuimhnigh na luachanna a choigeartú de réir do riachtanais shonracha.

3. Úsáid CSS chun íomhánna a athrú ar bhealach níos cruinne: Má theastaíonn tuilleadh solúbthachta uait maidir le méid na n-íomhánna, is féidir leat CSS a úsáid chun iad a athrú. Is féidir leat é seo a dhéanamh tríd an maoin "leithead" agus "airde" a úsáid sa riail CSS comhfhreagrach. Mar shampla: img { leithead: 50%; airde: féin; }. Athróidh sé seo an íomhá go 50% dá méid bunaidh agus coinneoidh sé a cóimheas gné.

Cuimhnigh, agus tú ag athrú méid íomhá, go bhfuil sé tábhachtach breathnú ar chuma amhairc agus inléiteacht ábhar do shuíomh Gréasáin. Bain triail as méideanna éagsúla agus modhanna athmhéadaithe chun an réiteach is fearr a fháil do do chás ar leith. Trí na céimeanna seo a leanúint agus na huirlisí cearta a úsáid, is féidir leat fadhbanna coitianta a bhaineann le méideanna íomhá HTML a réiteach.

13. Méid agus feidhmíocht íomhánna HTML a bharrfheabhsú

Agus tú ag obair le híomhánna HTML, tá sé riachtanach a mhéid agus a bhfeidhmíocht a bharrfheabhsú chun taithí luchtaithe agus luas do láithreán gréasáin a fheabhsú. Chun é seo a bhaint amach, tá sé tábhachtach roinnt treoirlínte a leanúint agus uirlisí éifeachtacha a úsáid. Seo thíos na céimeanna is gá chun íomhánna a bharrfheabhsú i HTML.

1. Comhbhrúigh íomhánna: Is é ceann de na bealaí is éifeachtaí chun méid na n-íomhánna a laghdú ná iad a chomhbhrú. Tá uirlisí éagsúla ar líne agus cláir speisialaithe ann a chabhróidh leat do chuid íomhánna a chomhbhrú gan mórán cáilíochta a chailleadh. Is féidir leat comhbhrúiteoirí íomhá ar líne a úsáid mar TinyPNG o jpegmini, nó bogearraí cosúil le Adobe Photoshop o GIMP chun do chuid íomhánna a chomhbhrú sula gcuirfidh tú iad le do láithreán gréasáin.

2. An fhormáid a bharrfheabhsú: Príomhphointe eile maidir le leas iomlán a bhaint as íomhá ná an fhormáid cheart a úsáid de réir an chineáil íomhá. Na formáidí is coitianta le haghaidh íomhánna ar an ngréasán a JPEG, PNG y GIF. JPEG oiriúnach le haghaidh grianghraif le raon leathan dathanna, agus PNG Is fearr a oireann do íomhánna le dathanna soladach agus trédhearcacht. An fhormáid GIF Úsáidtear é go príomha le haghaidh beochana nó íomhánna simplí. Tríd an bhformáid cheart a roghnú, is féidir leat méid do chuid íomhánna a laghdú tuilleadh.

3. Toisí agus taifeach cuí a shocrú: Bealach eile chun feidhmíocht íomhánna HTML a bharrfheabhsú is ea na toisí agus na réitigh chuí a shocrú. Tá sé tábhachtach leithead agus airde na híomhá a shonrú sa chód HTML chun cosc ​​a chur ar an mbrabhsálaí é a athrú go huathoibríoch, rud a d'fhéadfadh moill a chur ar luchtú an leathanaigh. Is féidir leat smaoineamh ar úsáid a bhaint as srcset chun méideanna éagsúla íomhá a shonrú le haghaidh feistí éagsúla, rud a fhágfaidh go bhféadfaí an íomhá is oiriúnaí do ghléas an úsáideora a luchtú go huathoibríoch.

Trí na céimeanna seo a leanúint agus na huirlisí agus na teicníochtaí cearta a úsáid, beidh tú in ann méid agus feidhmíocht na n-íomhánna ar do láithreán gréasáin a bharrfheabhsú, rud a fheabhsóidh taithí úsáideora agus luas luchtaithe. Cuimhnigh i gcónaí na torthaí a mheas agus tástálacha a reáchtáil chun an meascán is fearr de mhéid agus de cháilíocht íomhá a fháil do do láithreán gréasáin.

14. Conclúidí agus moltaí chun méid íomhá a athrú in HTML

I mbeagán focal, is próiseas simplí é méid íomhá a athrú i HTML is féidir a dhéanamh trí roinnt céimeanna simplí a leanúint. Ar dtús, tá sé tábhachtach a thabhairt faoi deara gur féidir méid íomhá a mhodhnú i HTML ag baint úsáide as airíonna leithead agus airde. Is féidir é seo a dhéanamh inlíne de chód nó trí úsáid a bhaint as uirlisí eagarthóireachta íomhá.

Bealach amháin chun íomhá a athrú ná trí na tréithe "leithead" agus "airde" sa chlib íomhá a úsáid. Mar shampla:
"`html
Cur síos ar an íomhá
"`
Sa sampla seo, taispeánfar an íomhá le leithead 500 picteilín agus airde 300 picteilín. Tá sé tábhachtach a thabhairt faoi deara, mura sonraítear ach ceann amháin de na tréithe (leithead nó airde), déanfar an íomhá a athrú go comhréireach chun an luach sonraithe a oiriúnú.

Bealach eile chun íomhá a athrú i HTML ná CSS a úsáid. Chun seo a dhéanamh, is féidir leat an mhaoin "leithead" agus "airde" a úsáid i mbileog stíl nó go díreach sa chlib íomhá. Mar shampla:
"`html

"`
Sa sampla seo, taispeánfar an íomhá le leithead 50% den choimeádán máguaird agus coigeartófar an airde go huathoibríoch chun cóimheas gné bunaidh na híomhá a choinneáil.

Chomh maith leis na roghanna atá luaite, tá uirlisí agus leabharlanna ar líne ann a fhágann go bhfuil an próiseas chun íomhánna a athrú i HTML níos éasca fós. Ligeann cuid acu duit an méid a choigeartú tríd an íomhá a tharraingt agus a scaoileadh, roghanna bearrtha agus comhbhrú a sholáthar, agus cuireann siad an fhéidearthacht ar fáil freisin an cód is gá a ghiniúint chun an íomhá a chur isteach i leathanach gréasáin. Is minic a bhíonn na huirlisí seo an-úsáideach dóibh siúd nach bhfuil aon taithí acu ar eagarthóireacht a dhéanamh ar íomhánna nó ar mian leo an próiseas a bhrostú. Cuimhnigh go bhfuil sé tábhachtach méid na n-íomhánna a bharrfheabhsú chun luas luchtaithe leathanach gréasáin a fheabhsú.

Mar fhocal scoir, is próiseas éasca é méid íomhá a athrú in HTML agus úsáid á baint as airíonna leithead agus airde, i gcomhréir le cód agus trí CSS a úsáid. Tá uirlisí ar líne ann freisin a dhéanann an próiseas seo níos éasca. Déan cinnte méid do chuid íomhánna a bharrfheabhsú chun feidhmíocht do shuíomh Gréasáin a fheabhsú.

Go hachomair, is tasc simplí ach tábhachtach é íomhá a athrú in HTML chun taispeáint agus feidhmíocht níos fearr ar an suíomh Gréasáin a chinntiú. Trí úsáid a bhaint as an tréith "leithead" agus "airde" sa chlib "img", is féidir leat méid inmhianaithe na híomhá a shainiú i bpicteilín agus i gcéatadán. Tá sé riachtanach a choinneáil i gcuimhne gur féidir saobhadh amhairc a thabhairt le tuiscint má dhéantar méid íomhá a mhodhnú go díreach i HTML mura gcoimeádtar an bhunchomhréir. Mar sin, tá sé inmholta cláir eagarthóireachta íomhá a úsáid chun coigeartuithe beachta a dhéanamh sula gcuirfear isteach sa chód HTML iad. Ina theannta sin, tá sé tábhachtach a mheas an tionchar a d’fhéadfadh a bheith ag méid na n-íomhánna ar luas luchtaithe an tsuímh Ghréasáin agus ar thaithí an úsáideora. Mar fhocal scoir, is fiú a lua go bhfuil iliomad teicnící agus uirlisí ann a ligeann duit íomhánna a bharrfheabhsú agus a athrú. go héifeachtúil, a d'fhéadfadh cabhrú le feidhmíocht agus éifeachtacht iomlán an tsuímh Ghréasáin a fheabhsú. Tá sé ríthábhachtach cothromaíocht cheart a choinneáil idir cáilíocht amhairc agus luas luchtaithe chun an t-eispéireas úsáideora is fearr a sholáthar.