ప్రతిమ ఎడిటర్‌లు, రీడర్లు

ప్రతిమ ఎడిటర్లు మనం ప్రతిమ ఫైళ్ళను తెరచి, వాటిని సవరించి (మార్పులు/చేర్పులు చేసి) సవరించిన రూపంలో భధ్రపరచడానికి వుపయోగపడతాయి. ప్రతిమ రీడర్లు (చదవడం అనే మాటకంటే దర్శించడం అనడం సబబుగా వుంటుందేమో!) లేదా దర్శిని ప్రోగ్రాములు మనం ప్రతిమను దర్శించడానికి వుపయోగపడతాయి. ప్రతిమ ఫైల్‌లో వున్న దత్తాన్ని అర్ధం చేసుకుని, ప్రతిమను ప్రదర్శిస్తాయి. ఫైల్ ఎడిటర్లు అన్ని సార్లూ ఫైల్ రీడర్లవ్వాలని లేదు (Html ఫైళ్ళ విషయంలో మనం యిది గమనించవచ్చు). అయితే ప్రతిమలకు సంబంధించినంతవరకు, షుమారుగా అన్ని ప్రతిమ ఎడిటర్లు, ప్రతిమ రీడర్లవ్వడం గమనిస్తాము. కేవలం ప్రతిమ రీడర్లయిన ప్రోగ్రాములు కూడా అనేకం మనకు తారసపడతాయి. (విండోస్ పిక్చర్ & ఫ్యాక్స్ వ్యువర్) • అనేక ప్రతిమ రూపాల ఎడిటర్లు చాలా ప్రతిమ ఎడిటర్లు, అనేక రూపాలలోని ప్రతిమలను సవరించడానికి వుపయోగపడతాయి. అవి ఒకటికంటే ఎక్కువ ప్రతిమ రూపాలను సవరించగలవు. ఉదా:- పెయింట్ బ్రష్ ప్రోగ్రామ్‌తో, jpg, jpeg, gif, png ప్రతిమలను సవరించవచ్చు. • అనేక ప్రతిమ రూపాల ఎడిటర్లు/రీడర్లు చాలా ప్రతిమ రీడర్ ప్రోగ్రాములు కూడా ఒకటి కంటే ఎక్కువ ప్రతిమ రూపాలను అర్ధం చేసుకుని ప్రతిమలను ప్రదర్శించగలవు. ఉదా:-Irfan viewer అనే ప్రోగ్రాము దరిదాపు అన్ని రకాల ప్రతిమ రూపాలను ప్రదర్శించగలదు. • బ్రౌసర్ » ప్రతిమ రీడర్ వెబ్ పుటలలో సాధారణంగా కనపడే ప్రతిమ రూపాలు jpg, jpeg, gif, png పేరు పొడిగింపు కలవి, వీటన్నింటిని వెబ్‌బ్రౌసర్లు అర్ధం చేసుకోగలవు/ప్రదర్శించగలవు. మీరు ఈ రూపాలలోని ఏదయినా ప్రతిమ ఫైల్‌ను బ్రౌసర్‌లో తెరిస్తే ఈ విషయం మీకు అర్ధమవుతుంది. ఈ క్రింది వివరణ/ప్రతిమ ఈ విషయాన్ని స్పష్టం చేస్తుంది. ప్రతిమ ఫైళ్ళను అర్ధం చేసుకుని ప్రదర్శించడమే కాక, బ్రౌసర్లు ప్రతిమలను అక్షర పాఠంలో అంతఃస్ధాపన చేసి ప్రదర్శించగలవు. మీరు చదువుచున్న పుట బ్రౌసర్ ప్రతిమలను అక్షర పాఠంలో అంతఃస్ధాపన చేసి ప్రదర్శించడానికి ఒక ఉదాహరణ.

అక్షరపాఠంలో ప్రతిమలను అంతఃస్థాపన చేసి ప్రదర్శించడం

• వోర్డ్ ప్రాసెసింగ్ డాక్యుమెంట్‌లో అక్షరపాఠంలో ప్రతిమలు అంతఃప్రతింష్టించబడివున్న ఒక వోర్డ్ ప్రాసెసింగ్ డాక్యుమెంట్‌ను [ఉదా:- మైక్రోసాఫ్ట్ వోర్డ్ డాక్యుమెంట్‌ను] పరిగణించండి. » వోర్డ్ ప్రాసెసర్ - ప్రతిమ రీడర్/ఎడిటర్ ప్రతిమలు డాక్యుమెంట్‌లో ప్రదర్శించబడతాయి కాబట్టి, వోర్డ్ ప్రాసెసింగ్ ప్రోగ్రామ్‌ను ప్రతిమ రీడర్‌గా పరిగణించవచ్చు. మనం వోర్డ్ ప్రాసెసింగ్ ప్రోగ్రామ్‌‌ను (మైక్రోసాఫ్ట్ వోర్డ్‌ను) వుపయోగించి, ప్రతిమలలాగానే వుండే ఆటోషేప్స్, టెక్ట్స్ ఆర్ట్, మొదలగునవి డాక్యుమెంట్‌లోనే సరిచేయగలుగుతాము. సాంకేతికంగా ఒక వోర్డ్ ప్రాసెసింగ్ ప్రోగ్రామ్‌ ప్రతిమ ఎడిటర్ కాదు. యితర రూపాలలో వున్న ప్రతిమలను (jpg, jpeg, gif, ... ) వోర్డ్ ప్రాసెసింగ్ ప్రోగ్రాములో నుండి సవరించలేము. వీటిని సవరించడానికి వేరే ప్రోగ్రాము సహాయము అవసరమవుతుంది. కాబట్టి, డాక్యుమెంట్‌లో వున్న అక్షరపాఠం, పట్టికలు, ఆటో షేప్స్, టెక్ట్స్ఆర్ట్​కు సంబంధించినంతవరకు, వోర్డ్ ప్రాసెసింగ్ ప్రోగ్రామ్‌ను ఎడిటర్ అనవచ్చు. కాని యితర ప్రతిమల (jpg, jpeg, gif, మొదలగు రూపాలలో వున్నవి.) కు సంబంధించినంతవరకు వోర్డ్ ప్రాసెసింగ్ ప్రోగ్రాం కేవలం రీడర్ మాత్రమే. » ప్రతిమలు అంతఃస్థాపన చేయబడ్డ వస్తురూపాలు (Objects) ప్రతి ప్రతిమ ఒక ఫైలే. కాబట్టి ఒక వోర్డ్ ప్రాసెసింగ్ ప్రోగ్రామ్ (మైక్రోసాఫ్ట్ వోర్డ్) రెండు రకాల పాఠాన్ని సంభాళిస్తుందనవచ్చు. ప్రోగ్రామ్‌కు వున్న అంతర్గత సత్తానుపయోగించి సవరించగలిగే లక్షణమున్న పాఠం (అక్షరపాఠం, పట్టికలు, ఆటో షేప్స్ మొదలగునవి) మరియు సవరించలేనటువంటి పాఠం. jpg, png మొదలగు రూపాలలో వున్న ప్రతిమల లాంటివి. వోర్డ్ డాక్యుమెంట్‌లో వున్న వోర్డ్ ప్రోసెసర్ సవరించలేని పాఠం, డాక్యుమెంట్‌లో అంతఃస్థాపన చేయబడ్డ వేరే ఫైలులో వున్న పాఠం. దీనిని ఒక ఆబ్జెక్ట్ వస్తురూపం (Object) అంటాము. ప్రోగ్రామ్ అంతర్గతంగా వున్న సత్తాతో సవరించలేని ఏ అంశమయినా ఒక వస్తురూపం (Object) అవుతుంది. మైక్రోసాఫ్ట్ వోర్డ్ ప్రోగ్రామ్ అంతఃప్రతిష్టించుకోగల ఆబ్జెక్ట్ యొక్క జాబితా కొరకు, Insert | object ... జాబితా పట్టి ఐచ్ఛికాన్నిఎంచుకోండి. » అంతఃస్థాపన చేయబడ్డ వస్తురూపం (Object) డాక్యుమెంట్‌తో పాటు భధ్రపరచబడుతుంది వోర్డ్ ప్రాసెసింగ్ (మైక్రోసాఫ్ట్ వోర్డ్), డాక్యుమెంట్‌‌లో అంతఃప్రతిష్టించిన ప్రతిమకు సంబంధించిన దత్తం/సమాచారాన్నంతా డాక్యుమెంట్‌తో పాటు అదే ఫైలులో యితర పాఠంతో పాటు భధ్రపరచబడుతుంది. అందువలన మనం వోర్డ్ ప్రాసెసింగ్ ప్రోగ్రాములలో వుపయోగించే ప్రతిమలు వేరే ఫైల్స్ అనే విషయాన్ని అరుదుగా గుర్తించగలుగుతాము. • వెబ్ పుటలో బ్రౌసర్ ఒక వెబ్ పుట రీడర్. కేవలం అక్షర పాఠాన్ని అర్ధం చేసుకోగల ఏ ప్రోగ్రామయినా ఒక వెబ్ పుట (Html లేక యితర ఫైల్) ఎడిటర్‌గా పనిచేస్తుంది. Html ఫైల్‌ను ఒక అక్షరపాఠ ఎడిటర్‌తో సృష్ఠిస్తాము కాబట్టి, ఒక ప్రతిమను అందులో అంతఃప్రతిష్టించి భద్రపరచడం సాధ్యపడదు. అయినప్పటికీ, ఒక వోర్డ్ ప్రాసెసింగ్ డాక్యుమెంట్‌‌లో వలెనే ఒక వెబ్ పుటలో కూడా అక్షర పాఠం, ప్రతిమలు కలిపి ప్రదర్శించబడటం మనం చూస్తూనే వుంటాము. బ్రౌసర్‌కు సంబంధించినంతవరకు Html కోడ్ వున్న అక్షర పాఠ ఫైల్, ప్రతిమ సమాచారం కలిగిన ఫైల్ రెండూ విడి విడి ఫైల్స్. ఒక వెబ్ పుటకు సంబంధించిన Html కోడ్‌ను (Html ఫైల్‌ను) తయారు చేస్తున్నప్పుడు, అక్షరపాఠంతో కలిపి ప్రదర్శించవలసిన ప్రతిమ ఫైల్‌కు సంబంధించిన సమాచారమును (పేరు, స్థానమార్గము, మొదలగునవి) Html కోడ్‌లో భాగంగా పొందు పరుస్తాము. బ్రౌసర్‌ Html ఫైల్‌ను (ప్రదర్శించవలసిన అక్షర పాఠం, పాఠ రూప కల్పనకు Html గుర్తులు, అక్షర పాఠంతో కలిపి ప్రదర్శించవలసిన ప్రతిమకు సంబంధించిన Html కోడ్‌ను కలిగి వున్న ఫైల్‌ను) చదివి Html గుర్తులను బట్టి, ఆ పాఠానికి రూపలావణ్యం చేకూర్చి బ్రౌసర్ గవాక్షంలో ప్రదర్శిస్తుంది. Html కోడ్‌లో భాగంగా వున్న ప్రతిమకు సంబంధించిన సమాచారమును వుపయోగించి, ప్రతిమ ఫైల్స్‌ను తెచ్చి, ఆ ప్రతిమను అక్షర పాఠంలో అంతఃప్రతిష్టించి ప్రదర్సిస్తుంది. ప్రతిమ ఫైళ్ళు Html ఫైల్ (వెబ్ పుట) లోభాగంగా అంతఃప్రతిష్టించబడవు. ప్రతిమలను బ్రౌసర్‌ Html ఫైల్‌ను ప్రదర్శించే ముందు అంతఃప్రతిష్టించి ప్రదర్సిస్తుంది. ఒక వెబ్ పుటలోభాగంగా ప్రదర్శించబడే ప్రతిమ ఫైల్‌కు సంబంధించిన సమాచారము (Html ఫైల్‌లో చేర్చబడేదానికి) ఉదాహరణ. <img src="http://photos1.blogger.com/blogger/6726/689/320/17.1.jpg"> ఒక ప్రతిమను వెబ్ పుటలో అంతఃప్రతిష్టించి ప్రదర్సించడానికి వుపయోగించే <img> Html గుర్తు, అంతం గుర్తు లేనటువంటి అతి కొద్ది Html గుర్తులలో ఒకటి. ఈ గుర్తును, సాధారణంగా ఏ అక్షర పాఠంలో అంతఃప్రతిష్టించి ప్రతిమను ప్రదర్శించాలో, ఆ పాఠానికి దగ్గరలో Html ఫైల్‌లో చేరుస్తాము. ఆ గుర్తులో భాగంగా చేర్చే అదనపు సమాచారం (గుణాలు/శైలి-లక్షణాలు) ఆ ప్రతిమ ఫైల్‌ను బ్రౌసర్ తోడ్కొని రావడానికి, ప్రతిమకు రూపలావణ్యం చేకూర్చి ప్రదర్శించడటానికి వుపయోగపడతాయి.

HTML కోడ్‌లో <img> గుర్తును ఎదుర్కోగానే బ్రౌసర్ ఏమి చేస్తుంది?

బ్రౌసర్ <img> గుర్తును ఎదుర్కోగానే, ఆ గుర్తు లోపల గుణాల/ శైలి-లక్షణాల రూపంలో పొందుపరచబడివున్న ఆ అంశానికి సంబంధించిన సమాచారమును గ్రహిస్తుంది. <img src="http://photos1.blogger.com/blogger/6726/689/320/17.1.jpg" height="200px" width="125px" alt="cuckoo bird" border="1"> అనేక గుణాలు నిర్వచించబడివున్న <img> గుర్తు src (source) అని చదువుతాము) గుణం యొక్క విలువ నుండి ఆ ప్రతిమ ఫైల్ పేరు, ఆ ఫైల్ స్థాన మార్గము, height, width గుణాల విలువల నుండి ప్రతిమ ఎత్తు, వెడల్పులను (లేదా అదే పేరుతో వున్న శైలి లక్షణాల విలువల నుండి) సేకరిస్తుంది. ఎత్తు, వెడల్పు నిర్వచించబడివున్నట్లయితే, బ్రౌసర్ వెబ్ పుటలో, అంత ప్రదేశాన్ని ఆ ప్రతిమ ప్రదర్శించడానికి కేటాయిస్తుంది. ఒకవేళ ఆ కొలతలు నిర్వచించబడిలేనట్లయితే బ్రౌసర్ ఆ ప్రతిమను సర్వర్ నుండి తెచ్చి అక్కడ నింపే వరకు ఆ ప్రతిమ స్ధానంలో చిన్న చతూరస్రాకారపు పేటికను లేదా కొద్దిపాటి ఖాళీని ప్రదర్శిస్తుంది. తదుపరి బ్రౌసర్ <img> గుర్తు తరువాత వున్న Html కోడ్‌ను విశ్లేషించే పనిలో ముందుకు వెళ్ళిపోతుంది. అదే సమయంలో అది సర్వర్‌కు Html ఫైల్‌ కోసం చేసినట్లుగానే ప్రతిమ ఫైల్ కొరకు ఆ ప్రతిమ ఫైల్ వున్న సర్వర్‌కు ఒక నివతిని పంపిస్తుంది. ఎత్తు, వెడల్పు సమాచారము బ్రౌసర్‌కు ఎంత ప్రదేశములో ప్రతిమను ప్రదర్శించాలో నిర్ణయించుకోవడానికి అవసరమవుతుంది. బ్రౌసర్ ప్రతిమ ఫైల్‌కు సంబంధించిన పాఠాన్ని స్వీకరించినదాన్ని స్వీకరించినట్లుగా ప్రతిమకోసం కేటాయించిన ప్రదేశములో ప్రదర్శించడం మొదలు పెడుతుంది. ప్రతిమ ఫైల్ పెద్ద పరిమాణము కలిగినదైతే మీరు ప్రతిమ క్రమ క్రమంగా నింపబడటం గమనించవచ్చు. ఒకవేళ ఎత్తు, వెడల్పు విలువలు గనుక <img> గుర్తు లోపల నిర్వచించబడిలేనట్లయితే, బ్రౌసర్ ప్రతిమను ప్రదర్శించాల్సిన చోట ఒక చిన్న పేటికను ప్రదర్శించి, ప్రతిమ ఫైల్ దత్తాన్ని సేకరించిన తరువాత అందులో వున్న సమాచారం ఆధారంగా, ఆ పేటిక పరిమాణాన్ని సవరించుకుంటుంది.

ప్రత్యామ్నాయ అక్షరపాఠం (Alt text)

బ్రౌసర్ ప్రతిమ కోసం ప్రదేశాన్ని కేటాయించిన వెంటనే, ఆ ప్రదేశములో <img> గుర్తు లోపల Alt (ఆల్టర్నేటివ్ టెక్స్ట్ అని చదువుతాము) గుణం యొక్క విలువగా పొందుపరచబడి వున్న అక్షర పాఠాన్ని ప్రదర్శిస్తుంది . <img src="__" height="__" width="__" alt="cuckoo bird" border="1"> ఒక వేళ ప్రతిమ ఆ ప్రదేశములో నింపబడకపోయినా, నింపడానికి సమయం పట్టినా అప్పటి వరకు పాఠకుడికి ఆ అక్షర పాఠం కనపడుతూ వుంటుంది. దీని వలన ఆ ప్రతిమ లేనప్పటికి పాఠకుడికి ప్రతిమను గురించిన సమాచారము తెలియచెయ్యటానికి వీలవుతుంది.

ప్రతిమ పరిమాణము

వెబ్ పుటలో ప్రతిమను ప్రదర్శించాల్సిన ప్రదేశము యొక్క కొలతలను (ఎత్తు, వెడల్పు) <img> గుర్తు లోపల అంశ గుణాలుగా కాని శైలి లక్షణాలుగా గాని నిర్వచించవచ్చు. ప్రతిమ ఎత్తు. ఎత్తు నిర్వచించడానికి ఈ క్రింది దానిలో ఒక దానిని వినియోగించవచ్చు. <img height="....px" > గుణం లేదా <img style="...; height:...px; ..." > శైలి లక్షణం. ప్రతిమ వెడల్పు వెడల్పును ఈ క్రిందివానిలో దేనినయినా వుపయోగించి నిర్వచించవచ్చు. <img width="....px" > గుణం లేదా <img style="...; width:...px; ..." > శైలి లక్షణం • లక్షణం విలువలు అసలు విలువలు కానట్లయితే! <img> గుర్తులోపల నిర్వచించబడ్డ ఎత్తు, వెడల్పు విలువలు, ప్రతిమ యొక్క అసలు ఎత్తు, వెడల్పు ఒకటి కానట్లయితే, బ్రౌసర్ <img> గుర్తు లోపల నిర్వచించబడి వున్న కొలతలకనుగుణంగా ప్రతిమను కేటాయించబడ్డ ప్రదేశములో సర్దుతుంది. అసలు ప్రతిమ చిన్నదైనట్లైతే బ్రౌసర్ ప్రతిమను సాగదీసి నిర్దేశిత ప్రదేశములో నింపి ప్రదర్శిస్తుంది. అసలు ప్రతిమ పెద్దదైనట్లైతే బ్రౌసర్ నిర్దేశిత ప్రదేశములో నింపడానికి వీలుగా ప్రతిమను కుంచిస్తుంది. కుంచించిన అసలు పరిమాణము సాగదీయబడ్డ w=50px; h=50px; w=91px; h=161px; w=150px; h=250px; ప్రతిమ ఎత్తు వెడల్పు <img> గుర్తు లోపల నిర్వచించడం బ్రౌసర్ ప్రతిమ యొక్క కొలతలను సేకరించడం కోసం వెబ్ సర్వర్‌తో ఒక అదనపు సంపర్కాన్ని చెయ్యనవసరం లేకుండా తప్పిస్తుంది. అదే సమయంలో తప్పు కొలతలు నమోదు చేసినట్లయితే ప్రతిమ ఆకృతి కోల్పోయే ప్రమాదం వుంది. సరియైన విలువలు/కొలతలు నిర్వచిస్తున్నట్లు నిస్చితపరచుకోండి. అనుమానంగా వుంటే కొలతలు నిర్వచించకండి.

ప్రతిమ ఫైల్ స్ధాన మార్గం

ప్రతిమ ఫైల్ యొక్క పేరు, స్ధాన మార్గం (ఎక్కడ వుంది అనే విషయం) <img> గుర్తులో src (సోర్స్ అని చదువుతాము) గుణం యొక్క విలువగా కనబడుతుంది. [ < img src = "/blogger/6726/689/320/17.1.jpg" >] • సంబోధన:: చిరునామా ఇంటర్నెట్‌కు అనుసంధించబడి వున్న కంప్యూటర్‌లో వున్న ఏదయినా ఫైల్ యొక్క యూఆర్‌ఎల్‌ను బ్రౌసర్ చిరూనామా పట్టిలో నమోదు చేసి, Enter కుంచికను నొక్కినప్పుడు, బ్రౌసర్ మనం నమోదు చేసిన చిరునామా ఆధారంగా సంబంధిత సర్వర్‌కు నివేదన పంపడం ద్వారా ఆ ఫైల్‌ను తీసుకొస్తుంది. ఫైల్‌ను సంబోధించడమంటే, ఫైల్ పేరును ఉచ్చరించడమే. ఫైల్ చిరునామా అంటే ఫైల్ వున్న ఫోల్డర్ పేరు (దీనినే మనం ఫైల్ స్థాన మార్గం లేదా పాత్ (path) అని అంటాము.) • సంబంధంగా సంబోధన సంబంధంగా సంబోధన అంటే ఒక ఫైల్/వనరు యొక్క స్థాన మార్గాన్ని, ఏ వెబ్ పుటలో రాస్తున్నామో (చేరుస్తున్నామో) ఆ వెబ్ పుట స్థాన మార్గానికి సంబంధంగా రాయడమే. ప్రతిమ ఫైల్ యొక్క స్థాన మార్గాన్ని, ప్రతిమను ఏ వెబ్ పుటలో అయితే ప్రదర్శించదలచామో, ఆ వెబ్ పుట యొక్క స్థాన మార్గానికి సంబంధంగా నమోదు చేయవచ్చు (ఆ రెండు ఫైళ్ళు ఒకే వెబ్ సైట్లో వున్నట్లయితేనే) images/logo.jpg images/ ← ఏ పుటలోనయితే ఈ చిరునామా (images/logo.jpg) నమోదు చేయబడి వుందో ఆ వెబ్ పుట వున్న ఫోల్డర్‌లోనే వున్న images అనే పేరు కలిగిన ఫోల్డర్‌ను సూచిస్తుంది. ../6726/689/320/17.1.jpg ../6726 ← ఏ పుటలోనయితే ఈ చిరునామా ( ../6726/689/320/17.1.jpg) నమోదు చేయబడి వుందో ఆ వెబ్ పుట వున్న ఫోల్డరుకు ఒక స్ధాయి పైన వున్న ఫోల్డర్‌లోని "6726" పేరు గల ఫోల్డర్‌ను సూచిస్తుంది. • సంపూర్ణ సంబోధన సంపూర్ణ సంబోధన అంటే ఒక ఫైల్/వనరు యొక్క స్ధానాన్ని పూర్తి చిరునామాతో వెబ్‌సైట్ మూలం నుండి మొదలు పెట్టి (వెబ్‌ సైట్ పేరు చిరునామాలో కలిగి వుండేటట్లు) రాయడమే. ఇటువంటి సంబోధన అన్ని పరిస్ధితులలోనూ వుపయోగించవచ్చు. సంబందంగా సంభోధన వుపయోగించే దగ్గర కూడా వుపయోగించవచ్చు. ఇది సాధారణంగా ప్రతిమ ఫైల్, ఆ ప్రతిమ ఫైల్ యొక్క చిరునామా చేర్చబడి వున్న వెబ్ పుట ఒకే వెబ్‌ సైట్‌లో లేనట్లయితే వుపయోగించబడుతుంది. http://www.theedifier.com/images/6726/689/320/17.1.jpg సంపూర్ణ సంబోధన వెబ్‌ సైట్ పేరును కలిగి వుంటుంది. సంబంధంగా సంబోధన వెబ్‌ సైట్ పేరును కలిగి వుండదు. • సంపూర్ణ సంబోధనకు లఘిష్టికము. ఒకే వెబ్‌ సైట్‌లో వున్న ఫైళ్ళకు సంపూర్ణ సంబోధన వినియోగించదలచినట్లయితే, వెబ్ చిరునామాలో వెబ్‌ సైట్‌ పేరుతో అంతమయ్యే భాగాన్ని తొలగించిన రూపాన్ని లఘిష్టిగా వాడుకోవచ్చు. http://www.theedifier.com/images/6726/689/320/17.1.jpg బదులు /images/6726/689/320/17.1.jpg [ఆ లఘిష్టము మొదట్లో వున్న '/' గుర్తును మూలము (root) అంటారు.]

ప్రతిమ లీనము

లీనం అమర్చడానికి సంబంధంగా, ప్రతిమలు రెండు స్థితులలో కనపడతాయి. అవి పంక్తి స్ధాయిలో వుండవచ్చు, లేదా తేలుతూ వుండవచ్చు. ప్రతిమలకు లీనాన్ని ఏర్పరచడానికి <img align="___"> అనే గుణం లేదా <img style="float: ___" > శైలి లక్షణం వుపయోగిస్తాము align గుణానికి సమతల స్ధితిలో లీనానికి రెండు విలువలు - కుడి (right), ఎడమ (left), మరియు లంభరేఖ స్ధితిలో లీనానికి మూడు విలువలు - పైన (top), మధ్య (middle), క్రింద (bottom) వున్నాయి. వీటిలో ఏదో ఒకటి మాత్రమే వుపయోగించగలుగుతాము. శైలి (style) లక్షణానికి సమతల స్ధితిలో లీనానికి మాత్రమే, రెండు విలువలు - కుడి (right), ఎడమ (left) వున్నాయి. • అక్షరం/చిహ్నం ఎత్తు » పంక్తి ఎత్తు ప్రతి చిహ్నం ఒక అదృశ్య పేటికలో వున్నట్లు భావించవచ్చు. ఆ పేటికకు వున్న ఎత్తే అందులో వున్న చిహ్న/ అక్షరము యొక్క ఎత్తు అవుతుంది. ఒక పంక్తిలో వున్న చిహ్నాల/అక్షరముల గరిష్ట ఎత్తు ఆ పంక్తి యొక్క ఎత్తు అవుతుంది. • పంక్తి స్ధాయి ప్రతిమలు నిలువు/లంభ స్ధితిలో లీనాన్ని align గుణంతో top, middle, bottom విలువలు వుపయోగించి నట్లయితే, ప్రతిమ పంక్తి స్ధాయిలో (మిగతా అక్షరాలతో పాటు కలిపి) చేర్చబడుతుంది. పంక్తిస్ధాయిలో చేర్చబడ్డ ప్రతిమ, ఆ ప్రతిమ ఎత్తు, వెడల్పు కలిగిన ఒక చిహ్నం/అక్షరంగా పరిగణించబడుతుంది. bottom ఎంచుకున్నట్లయితే, ఆ పంక్తిలోని అక్షరాల యొక్క పాదంతో ప్రతిమ యొక్క పాదం లీనమవుతుంది. top ఎంచుకున్నట్లయితే, ఆ పంక్తిలోని అక్షరాల యొక్క తలతో ప్రతిమ యొక్క తల లీనమవుతుంది. middle ఎంచుకున్నట్లయితే, ఆ పంక్తిలోని అక్షరాల యొక్క నిలువు మద్య భాగంతో ప్రతిమ యొక్క నిలువు మద్య భాగం లీనమవుతుంది. • తేలుతున్న ప్రతిమలు సమతల స్ధితిలో లీనం చేసే ఐచ్చికలు ఎంచుకున్నట్లయితే ప్రతిమ తేలుతున్నట్లవుతుంది. ప్రతిమ తేలుతున్నప్పుడు దాని దగ్గరలోని అక్షర పాఠం మీరు ఎంచుకున్న లీన ఐచ్చికాన్ని బట్టి ప్రతిమ ప్రక్కన పేర్చబడుతుంది/చుట్టబడుతుంది. సమతల స్ధతి లీనాన్ని alignment గుణానికి ఎడమ/కుడి (left/right) విలువలను వుపయోగించి లేదా అవే విలువలను శైలి లక్షణానికి వుపయోగించి గాని అమర్చవచ్చు. ఎడమ (left) ఎంచుకున్నట్లయితే, ప్రతిమ ఎడమ ప్రక్కకు లీనమయి, దాని దగ్గరలోని అక్షర పాఠం ప్రతిమ కుడి ప్రక్కన పేర్చబడుతుంది. కుడి (right) ఎంచుకున్నట్లయితే, ప్రతిమ కుడి ప్రక్కకు లీనమయి, దాని దగ్గరలోని అక్షర పాఠం ప్రతిమ ఎడమ ప్రక్కన పేర్చబడుతుంది.

ప్రతిమ అంచులు

ఏ Html అంశానికయినా, అంచు అంటే, దాని చుట్టూ నలువైపులా గీయబడే గీత. ఆ నాలుగు వైపులు వరుసగా పైన, కుడి, క్రింద, ఎడమగా గుర్తించబడతాయి. అంచు కలిగి వుండదగ్గ Html అంశాలకు, అంచు మందాన్ని నిర్ధిష్టంగా వ్యక్తపరచడం ద్వారా బ్రౌసర్‌లో అంచు కనబడేటట్లు చెయ్యవచ్చు. ఒక ప్రతిమకు బ్రౌసర్ ఒక నిర్ధిష్టమైన మందంగల అంచును ప్రదర్శించేటట్లు చెయ్యడానికి border="__" అనే గుణాన్ని వుపయోగిస్తాము. ఈ గుణం యొక్క విలువ, అంచుకు మనం వుద్దేశించే మందం (పిక్సెల్స్‌లో) అవుతుంది. (ఉదా: border=2 ) Html అంశాలకు అంచును అమర్చడానికి వుపయోగించే శైలి లక్షణం మూడు కొలమానాలను వుపయోగిస్తుంది. అంచు - మందం, శైలి/రకం, వర్ణం. ఈ మూడు కొలమానాలను border-width:__; border-style:__; border-color:__; అని విడివిడిగా నిర్వచించవచ్చు, లేదా అన్నింటిని కలిపి ఒకే శైలి లక్షణం కింద border: మందం విలువ, శైలి/రకం విలువ, వర్ణం విలువగా నిర్వచించవచ్చు. • ఉదాహరణ 2px మందం కలిగిన నీలం రంగు గీతల అంచు ఏర్పరచడానికి style="border-width:2px; border-style:dotted; border-color:blue" లేదా style="border:2px dailed blue" అని నిర్వచించవచ్చు. left » 4px double green right » 4px solid tomato » 5px inset gray » 4px outset snow; » top:4px dotted navy; » right:4px solid sienna Html అంశం గుణాలను వుపయోగించి అంచు మందం మాత్రమే నిర్వచించగలుగుతాము. అదే శైలి లక్షణాలను వుపయోగిస్తే మూడు లక్షణాలను నిర్వచించవచ్చు. ప్రతి అంచును విడివిడిగా (border-left:___; border-top:___; border-bottom:___; border-right:___;) శైలి లక్షణాలను వుపయోగించి నిర్వచించడం ద్వారా ప్రతిమకు ఒకటి కంటే ఎక్కువ రకాల అంచులను విశిష్టంగా కనపడేటట్లు చెయ్యవచ్చు. ఇలా అంచులను విడివిడిగా విశిష్టంగా నిర్వచించేయప్పుడు కూడా మూడు అంచు కొలమానాలను (border-top-color:__; border-top-width:__; border-top-style:__;) విడివిడిగా లేదా మూడు కొలమానాలను కలిపి నిర్వచించవచ్చు. • ఉదాహరణ ఒక ప్రతిమకు (లేదా అంచు వుండదగ్గ ఏ Html అంశానికైనా గాని) ముద్దగా వున్న 5px మందం గల, సియన్నా రంగు అంచును ఏర్పరచడానికి- style="border-top-width:5px; border-top-style:solid; border-top-color:sienna" లేదా style="border-top:5px solid sienna" ఉపయోగించండి. శైలి లక్షణాలు, Html అంశ గుణాల మీద అగ్రగామిత్వాన్ని కలిగి వుంటాయి. ఒకే ఆలోచనను (ఉదా: అంచు మందం) గుణాల ద్వారా, శైలి లక్షణాల ద్వారా నిర్వచిస్తే, శైలి లక్షణాలలోని నిర్వచనమే అనువర్తించబడుతుంది. అంచు శైలి లక్షణాలలో భాగంగా, అంచు శైలి/రకంకు వినియోగించదగ్గ విలువలు : (1) solid (ముద్ద) (2) dotted (చుక్కలతోడిది) (3) dashed (గీతలతోడిది) (4) double (రెండు గీతలు) (5) inset (లోనికి తోయబడ్డ) (6) outset (బయటకు లాగబడ్డ). • అదృశ్య అంచులు. ప్రతి Html అంశానికి అంచు వుంటుంది. ఏ అంశాలకయితే అంచు నిర్ధిష్ఠంగా నిర్దేశించబడి వుంటుందో, ఆ అంశాలకు బ్రౌసర్‌లో అది ప్రదర్శించబడుతుంది. లేనట్లయితే దాచబడి/అదృశ్యంగా వుంటుంది. అంచును నిర్దేశిస్తూనే మందాన్ని తెలియజేసే గుణానికి లేదా శైలి లక్షణానికి "0px" విలువను ఆపాదించడం ద్వారా కూడా అది అదృశ్యంగా వుండేటట్లు చెయ్యవచ్చు. అంచుకు వర్ణాన్ని ఆ Html అంశం చుట్టు పక్కల వున్న అంశాలతో కలిసి పోయేటట్లు వున్న వర్ణాన్ని లేదా పుట నేపద్యం యొక్క వర్ణాన్ని ఎంచుకోవడం ద్వారా కూడా (కొన్ని సార్లు) అంచును లేనట్లుగా భ్రమింపచేయవచ్చు.

ప్రతిమ అంచుల రంగులు/వర్ణాలు

కంప్యూటర్లలో రంగులన్నీ, మూడు ప్రాధమిక వర్ణాలు - ఎరుపు, ఆకు పచ్చ, నీలం వేరువేరు నిష్పత్తులలో కలిపతే ఏర్పడేవే. వెబ్ పుటలను సృష్టించేటప్పుడు మనం అనేక చోట్ల వర్ణాలను నిర్దేశిస్తాము. Html లో వర్ణాలను మూడు రకాలుగా నిర్దేశించవచ్చు. • షడ్దశ విలువలు [color:#0000ff] వర్ణాన్న సూచించే షడ్దశ (Hexa decimal) విలువ, ఆరు అంకెలు కలిగి వుండి ముందు # గుర్తు/చిహ్నంతో మొదలవుతుంది. ప్రతి అంకె ఒక షడ్దశ సంఖ్య (0 నుండి 9 వరకు ఆ పైన A నుండి F వరకు - మొత్తం 16). మొదటి రెండు అంకెలు ఎరుపు, తరువాతి రెండు అంకెలు ఆకుపచ్చ, చివరి రెండు అంకెలు నీలం వర్ణాలకు సూచికలు. [00000 - నలుపును సూచిస్తుంది, FFFFFF - తెలుపుకు సూచిక.] • RGB సంకేతనం [color: rgb(0, 0, 255)] RGB సంకేతనంలో వర్ణాన్ని సూచించే విలువలు rgb అక్షరాల తదుపరి చిన్న బ్రాకెట్ల మద్య పొందుపరుస్తాము. మొత్తం వర్ణం విలువ కామాలతో విడగొట్టబడ్డ మూడు సంఖ్యల రూపంలో వుంటుంది. ఈ మూడు విలువలు, ఒక్కొక్కటి 0 నుండి 255 వరకు వుండొచ్చు. మొదటి సంఖ్య ఎరుపు, రెండవ సంఖ్య ఆకు పచ్చ, మూడవ సంఖ్య నీలాన్ని సూచిస్తాయి. [rgb (0,0,0)-నలుపు, rgb(2555,255,255) తెలుపుకు సూచికలు.] • వర్ణ నామాలు [color:blue] w3c (world wide web consortium) నిర్వచించిన 140 Html వర్ణ నామాలను, ఆ నామాలను వుపయోగించడం ద్వారా అనువర్తింపచేయవచ్చు. బ్రౌసర్లు ఈ నామాలను అర్ధం చేసుకుని సంబంధిత వర్ణాన్ని ప్రదర్శించగలవు. షడ్దశ విలువలు, rgb సంకేతాల స్ధానంలో ఈ నామాలను వినియోగించవచ్చు. [black, white, Gold, silver, oldlace, wheat, papayawhip, lavender etc] • Color/Colour సాధారణ వాడుకలో color (అమెరికన్ ఇంగ్లీషు), colour (బ్రిటీష్ ఇంగ్లీషు) వుపయోగించవచ్చు కాని, Html లో మాత్రం "color" మాత్రమే సరియైన అక్షర క్రమం క్రింద పరిగణించబడుతుంది. గమనించగలరు.

ఖాళీలు

ఒక Html అంశం చుట్టూ గీయబడి వుండే అంచు అదృశ్యంగా/సదృశ్యంగా వుండొచ్చు. Html అంశం యొక్క అంచుకు సంబంధంగా ఖాళీలను రెండు రకాలుగా సృష్టించవచ్చు. అంతర్గతంగా : అంచుకు Html అంశానికి మధ్య ఖాళీ - ఒత్తు (padding) అంటాము, బహిర్గతంగా : అంచుకు చుట్టు పక్కల వున్న Html అంశాలకు మద్య ఎడం/ఖాళీ - అంచుబయట ఖాళీ (margin) అంటాము. ఒత్తు, అంచుబయట ఖాళీ, రెండూ కూడా ప్రతిమ (లేక అంచు వుండ దగ్గ ఏ Html అంశానికైనా) నాలుగు (పై భాగం, కుడి, క్రింద భాగం, ఎడమ) వైపులా వుండవచ్చు. ప్రతిమకు/Html అంశానికి అంచు బయట ఖాళీని hspace="__" మరియు vspace="__" గుణాలు వుపయోగించి సృష్టించవచ్చు లేదా style="margin:__" శైలి లక్షణాన్ని వుపయోగించి సృష్టించవచ్చు. అంచు బయట ఖాళీని అన్ని అంచులకు వేరువేరుగా శైలి లక్షణాలను వుపయోగించి సృష్టించవచ్చు. [ఉదా: style=margin-right:"__"]. ఒత్తును మాత్రం ప్రతిమకు/table కు తప్ప యితర Html అంశాలకు style="padding:__" శైలి లక్షణాన్ని వుపయోగించి మాత్రమే సృష్టించగలము. ఒత్తును అన్ని అంచులకు వేరు వేరుగా శైలి లక్షణాలను వుపయోగించి సృష్టించవచ్చు. [ఉదా:- style="padding-bottom:__"] • సమతల ఖాళీ సమతల ఖాళీ అనగా Html అంశానికి కుడి, ఎడమ వైపుల వుండే ఖాళీ. సమతల ఖాళీని ఈ క్రింది విధములుగా సృష్టించవచ్చు. » అంచుబయట ఖాళీలను సృష్టించడం ద్వారా అంచుబయట సమతల ఖాళీని ఈ క్రింది ఐచ్ఛికలను వుపయోగించి సృష్టించవచ్చు. గుణాలు "hspace=12px" [కుడి, ఎడమ - రండువైపులా అంచుబయట ఖాళీ]. శైలి లక్షణాలు "margin-left:5px" "margin-right:9px" "margin:10px 5px" [అంచుబయట పైభాగాన, క్రింది భాగాన 10px ఖాళీ మరియు   అంచు బయట కుడి, ఎడమ ప్రక్కల 5px ఖాళీ] » ఒత్తు సృష్టించడం ద్వారా సమతల ఒత్తును సృష్టించడానికి ఈ క్రింది ఐచ్ఛికలను వుపయోగించవచ్చు. శైలి లక్షణాలు "padding-left:4px" "padding-right:3px" "padding:8px 6px" [పై భాగాన, క్రింది భాగాన 8px ఒత్తు, కుడి, ఎడమ వైపుల 6px ఒత్తు] • నిలువు ఖాళీ నిలువు ఖాళీ Html అంశం పైభాగాన, క్రింది భాగాన వుండే ఖాళీ, నిలువు ఖాళీని ఈ క్రింది విధములుగా సృష్టించవచ్చు. » అంచుబయట ఖాళీలను సృష్టించడం ద్వారా అంచుబయట నిలువు ఖాళీలను ఈ క్రింది ఐచ్ఛికలను వుపయోగించి సృష్టించవచ్చు. గుణాలు "vspace=10px" [పై భాగాన, క్రింది భాగాన అంచుబయట 10px ఖాళీ] శైలి లక్షణాలు "margin-top:4px" "margin-bottom:5px" "margin:4px 12px" [అంచు బయట పై భాగాన, క్రింది భాగాన 4px ఖాళీ, మరియు   కుడి, ఎడమ ప్రక్కల అంచు బయట 12px ఖాళీ] » ఒత్తు సృష్టించడం ద్వారా ఒత్తుతో నిలువు ఖాళీలను ఈ క్రింది ఐచ్ఛికలను వుపయోగించి సృష్టించవచ్చు. శైలి లక్షణాలు "padding-top:6px" "padding-bottom:5px" "padding:4px 9px" [పై భాగాన, క్రింది భాగాన 4px ఒత్తు, కుడి, ఎడమ ప్రక్కల 9px ఒత్తు] అంచు బయట ఖాళీలు/ఒత్తును అమర్చడానికి శైలి లక్షణాలను వుపయోగించినప్పుడు రెండు విలువలను నిర్దేశించినట్లయితే, మొదటి విలువ పైభాగం, క్రింది భాగంకు రెండవ విలువ కుడి, ఎడమ ప్రక్కలకు అనువర్తించబడుతుంది. నాలుగు విలువలను నిర్దేశించినట్లయితే, మొదటి విలువ పైభాగానికి, రెండవ విలువ కుడి ప్రక్కకు, మూడవ విలువ క్రింది భాగానికి, నాలుగవ విలువ ఎడమ ప్రక్కకు అనువర్తించబడతాయి. ["margin: 5px 10px 15px 12px"] అంచులు అదృశ్యంగా వున్నట్లయితే, ఖాళీలను సృష్టించడానికి అంచుబయట ఖాళీలు వుపయోగించామా లేక ఒత్తును వుపయోగించామా అన్నది విశిదమవదు. అంచులు సదృశ్యంగా వున్నట్లయితే అంచు బయట ఖాళీలు అంచుకు బయట పక్క, బత్తు అంచు లోపల వున్నట్లుగా గుర్తించవచ్చు.

అనువాదం :: నేర్పు జట్టు

ఈ పుటకు ఆంగ్ల మూలం

... తరువాతి పుట ౧౮ (18)