వెబ్ పేజీ యొక్క రూపాన్ని మెరుగుపరుస్తుంది మరియు కస్టమర్ ఇంటరాక్షన్ పెంచుతుంది కాబట్టి చిత్రాలు వెబ్ పేజీలో చాలా ముఖ్యమైన భాగం. బహుళ వెబ్‌సైట్‌ల యుఎస్‌పి వారు తమ వెబ్‌పేజీలలో విభిన్న చిత్రాలను ఎలా ఆర్గనైజ్ చేస్తారు మరియు దానికి రుచులను జోడిస్తారు. ఇందులో చిత్రాల కథనం, కింది క్రమంలో HTML ఉపయోగించి వెబ్‌పేజీలో చిత్రాలను ఎలా పొందుపరచాలో మేము అర్థం చేసుకుంటాము:
HTML లో చిత్రాన్ని ఎలా జోడించాలి
వెబ్‌పేజీలో చిత్రాన్ని పొందుపరచడానికి HTML మీకు ఇస్తుంది ట్యాగ్. గుర్తుంచుకోవలసిన మరో ముఖ్యమైన విషయం ఏమిటంటే,
ముగింపు ట్యాగ్ లేదు. scr చిత్రం యొక్క మార్గాన్ని పేర్కొనడానికి లక్షణం ఉపయోగించబడుతుంది, ఇది సిస్టమ్ / సర్వర్ నుండి url లేదా ఇమేజ్ మార్గం కావచ్చు. మొదట HTML ఉపయోగించి వెబ్‌పేజీలో చిత్రాన్ని పొందుపరచడం యొక్క ప్రాథమిక వాక్యనిర్మాణంతో ప్రారంభిద్దాం.
సింటాక్స్
img src = 'img / front-end-web-development / 50 / what-are-html-images.png'>నమూనా కోడ్
వెబ్‌పేజీలో HTML ఇమేజ్ ఎంబెడ్డింగ్ ఇమేజెస్
ఇతర ట్యాగ్‌ల మాదిరిగానే, వివిధ లక్షణాలతో సంబంధం కలిగి ఉన్నాయి ట్యాగ్. వాటిలో ప్రతి ఒక్కటి ఒక్కొక్కటిగా చూద్దాం, వారి అవసరాన్ని అర్థం చేసుకోండి మరియు వాటిని ఎలా ఉపయోగించాలో.
HTML చిత్రాలు టాగ్లు
- alt లక్షణం
Alt గుణం అనేది చిత్రానికి ప్రత్యామ్నాయ వచనం. ఆల్ట్ గుణం ప్రవేశపెట్టడానికి కారణం ఏ కారణం చేతనైనా చిత్రాన్ని లోడ్ చేయలేకపోతే, ప్రత్యామ్నాయ వచనం చిత్రం గురించి ఒక ఆలోచన ఇస్తూ కనిపిస్తుంది. చిత్రం లోడ్ కాకపోవడానికి కారణాలు నెమ్మదిగా ఇంటర్నెట్ కనెక్షన్ కావచ్చు లేదా చిత్రం అందించిన మూలంలో ఉండదు.
HTML ఫైల్ ఉన్న అదే ఫోల్డర్ లోపల చిత్రం నివసిస్తుంటే, మీరు ఫైల్ పేరును నేరుగా పేర్కొనవచ్చు. లేకపోతే, మీరు ఇమేజ్ ఫైల్ యొక్క సంపూర్ణ మార్గాన్ని అందిస్తారు.
Alt గుణం యొక్క విలువ చిత్రాన్ని వివరించాలి.
ఉదాహరణ
వెబ్‌పేజీలో HTML ఇమేజ్ ఎంబెడ్డింగ్ ఇమేజెస్
జావాలో math.abs ఏమి చేస్తుంది
- చిత్రం యొక్క వెడల్పు మరియు ఎత్తు
చిత్రం యొక్క ఎత్తు & వెడల్పును సెట్ చేయడానికి శైలి లక్షణం ఉపయోగించబడుతుంది. శైలి లక్షణంలో మీరు CSS స్టైలింగ్‌ను పేర్కొంటారు.
వెబ్‌పేజీలో HTML ఇమేజ్ ఎంబెడ్డింగ్ ఇమేజెస్
HTML ఉపయోగించి వెబ్‌పేజీలో చిత్రాన్ని పొందుపరచేటప్పుడు కొన్ని ముఖ్యమైన అంశాలు:
- వెడల్పు మరియు ఎత్తు గుణాలు పిక్సెల్‌లలో నిర్వచించబడ్డాయి.
- మీరు చిత్రం యొక్క వెడల్పు మరియు ఎత్తును శాతంలో నిర్వచించవచ్చు. ఇది మొత్తం వెబ్‌పేజీ ప్రకారం శాతాన్ని పరిశీలిస్తుంది.
- మీరు వాటిలో ఒకదాన్ని మాత్రమే పేర్కొంటే, అది మరొకదాన్ని తదనుగుణంగా సర్దుబాటు చేస్తుంది.
- URL ఉపయోగించి చిత్రాలను పొందుపరచడం
URL ను పేర్కొనడం ద్వారా మీరు మరొక సర్వర్ నుండి చిత్రాన్ని ఎంచుకునే సౌలభ్యాన్ని HTML మీకు ఇస్తుంది. చిత్రాలను హోస్ట్ చేయడానికి మీరు ప్రత్యేక సర్వర్‌ను ఉపయోగించవచ్చు మరియు ఆ చిత్రాలను URL ఉపయోగించి పొందుపరచవచ్చు.
వెబ్‌పేజీలో HTML ఇమేజ్ ఎంబెడ్డింగ్ ఇమేజెస్
- చిత్రం లింక్‌గా
మీరు చిత్రంపై లింక్‌ను ఉపయోగించుకోవచ్చు, అక్కడ వినియోగదారు చిత్రంపై క్లిక్ చేసి కొత్త వెబ్‌పేజీలో దిగవచ్చు. అలా చేయడానికి, మీరు చాలు రోజు ట్యాగ్.
వెబ్‌పేజీలో HTML ఇమేజ్ ఎంబెడ్డింగ్ ఇమేజెస్
- చిత్రం తేలియాడే
మీరు CSS ఫ్లోట్ ప్రాపర్టీని ఉపయోగించి చిత్రం యొక్క అమరికను కూడా సర్దుబాటు చేయవచ్చు. అన్ని CSS ఆస్తి శైలి లక్షణంలో పేర్కొనబడాలి.
HTML చిత్రం
- చిత్ర పటాలు
HTML అందించే ముఖ్యమైన లక్షణాలలో ఇది ఒకటి. ఇమేజ్-మ్యాప్‌ను నిర్వచించడంలో ట్యాగ్ సహాయపడుతుంది. ఇమేజ్ మ్యాప్ అంటే ఏమిటో మీరు ఆలోచిస్తూ ఉండాలి. ఇమేజ్-మ్యాప్ క్లిక్ చేయగల ప్రాంతాలతో కూడిన చిత్రం
HTML చిత్రం
- నేపథ్య చిత్రం
మీరు వెబ్‌పేజీలో నేపథ్య చిత్రాన్ని కూడా జోడించవచ్చు. మీరు CSS ఆస్తిని ఉపయోగించాలి, అనగా స్టైల్ ట్యాగ్‌లోని నేపథ్య-చిత్రం మరియు దానిని HTML మూలకానికి జోడించండి.
HTML చిత్రంనేపథ్య చిత్రం
శరీర మూలకం
దీనితో మేము ఈ HTML ఇమేజెస్ బ్లాగ్ ముగింపుకు వచ్చాము.ఇప్పుడు పైన పేర్కొన్న స్నిప్పెట్లను అమలు చేసిన తర్వాత మీరు HTML లో చిత్రాన్ని ఎలా చొప్పించాలో అర్థం చేసుకోవచ్చు. ఈ బ్లాగ్ మీకు సమాచారం మరియు అదనపు విలువను ఇస్తుందని నేను ఆశిస్తున్నాను.
మా చూడండి ఇది బోధకుడు నేతృత్వంలోని ప్రత్యక్ష శిక్షణ మరియు నిజ జీవిత ప్రాజెక్ట్ అనుభవంతో వస్తుంది. ఈ శిక్షణ బ్యాక్ ఎండ్ మరియు ఫ్రంట్ ఎండ్ వెబ్ టెక్నాలజీలతో పనిచేయడానికి మీకు నైపుణ్యాలలో నైపుణ్యం కలిగిస్తుంది. ఇందులో వెబ్ డెవలప్‌మెంట్, j క్వెరీ, కోణీయ, నోడ్జెఎస్, ఎక్స్‌ప్రెస్‌జెఎస్ మరియు మొంగోడిబిపై శిక్షణ ఉంటుంది.
టేబులో డేటా బ్లెండింగ్ లెఫ్ట్ జాయిన్
మాకు ప్రశ్న ఉందా? దయచేసి దీనిని “HTML ఇమేజెస్” బ్లాగ్ యొక్క వ్యాఖ్యల విభాగంలో పేర్కొనండి మరియు మేము మిమ్మల్ని సంప్రదిస్తాము.