Google Chrome లో HTML మూలాన్ని ఎలా చూడాలి

మీరు మీ సైట్ యొక్క సోర్స్ కోడ్‌ను డీబగ్ చేస్తున్న వెబ్ డిజైనర్ అయినా లేదా సైట్ కోడ్ ఎలా ఉంటుందనే దానిపై ఆసక్తిగా ఉన్నా, మీరు Google Chrome లోనే HTML మూలాన్ని చూడవచ్చు. HTML మూలాన్ని వీక్షించడానికి రెండు మార్గాలు ఉన్నాయి: మూలాన్ని వీక్షించండి మరియు డెవలపర్ సాధనాలను ఉపయోగించి తనిఖీ చేయండి.

వీక్షణ పేజీ మూలాన్ని ఉపయోగించి మూలాన్ని చూడండి

Chrome ని కాల్చండి మరియు మీరు HTML సోర్స్ కోడ్‌ను చూడాలనుకునే వెబ్‌పేజీకి వెళ్లండి. పేజీ యొక్క మూలాన్ని క్రొత్త ట్యాబ్‌లో చూడటానికి పేజీపై కుడి-క్లిక్ చేసి, “పేజీ మూలాన్ని వీక్షించండి” పై క్లిక్ చేయండి లేదా Ctrl + U నొక్కండి.

వెబ్‌పేజీ కోసం అన్ని HTML తో పాటు కొత్త టాబ్ తెరుచుకుంటుంది, పూర్తిగా విస్తరించబడింది మరియు ఫార్మాట్ చేయబడలేదు.

మీరు HTML మూలంలో ఒక నిర్దిష్ట మూలకం లేదా భాగం కోసం చూస్తున్నట్లయితే, వీక్షణ మూలాన్ని ఉపయోగించడం శ్రమతో కూడుకున్నది మరియు గజిబిజిగా ఉంటుంది, ప్రత్యేకించి పేజీ చాలా జావాస్క్రిప్ట్ మరియు CSS లను ఉపయోగిస్తే.

డెవలపర్ సాధనాలను ఉపయోగించి మూలాన్ని పరిశీలించండి

ఈ పద్ధతి Chrome లో డెవలపర్ టూల్స్ పేన్‌ను ఉపయోగిస్తుంది మరియు సోర్స్ కోడ్‌ను వీక్షించడానికి చాలా శుభ్రమైన విధానం. అదనపు ఆకృతీకరణ మరియు మీరు చూడటానికి ఆసక్తి లేని అంశాలను కూల్చివేసే సామర్థ్యం కారణంగా HTML ఇక్కడ చదవడం సులభం.

Chrome ను తెరిచి, మీరు పరిశీలించదలిచిన పేజీకి వెళ్ళండి; అప్పుడు Ctrl + Shift + i నొక్కండి. మీరు చూస్తున్న వెబ్‌పేజీతో పాటు డాక్ చేయబడిన పేన్ తెరవబడుతుంది.

మరింత విస్తరించడానికి మూలకం పక్కన ఉన్న చిన్న బూడిద బాణంపై క్లిక్ చేయండి.

మీరు పూర్తి పేజీ కోడ్‌ను డిఫాల్ట్‌గా చూడకూడదనుకుంటే, బదులుగా HTML లోని ఒక నిర్దిష్ట మూలకాన్ని పరిశీలించి, పేజీలోని ఆ స్థలాన్ని కుడి క్లిక్ చేసి, ఆపై “తనిఖీ చేయండి” క్లిక్ చేయండి.

పేన్ ఈసారి తెరిచినప్పుడు, అది మీరు క్లిక్ చేసిన మూలకాన్ని కలిగి ఉన్న కోడ్ యొక్క భాగానికి నేరుగా వెళుతుంది.

మీరు డాక్ స్థానాన్ని మార్చాలనుకుంటే, మీరు దానిని దిగువ, ఎడమ, కుడి వైపుకు తరలించవచ్చు లేదా ప్రత్యేక విండోలోకి అన్లాక్ చేయవచ్చు. మెను చిహ్నాన్ని క్లిక్ చేయండి (మూడు చుక్కలు), ఆపై ప్రత్యేక విండోలోకి అన్డాక్ చేయండి, ఎడమవైపు డాక్ చేయండి, దిగువకు డాక్ చేయండి లేదా కుడి వైపున డాక్ చేయండి.

దానికి అంతే ఉంది. మీరు కోడ్‌ను చూడటం పూర్తి చేసినప్పుడు, మీ వెబ్‌పేజీకి తిరిగి రావడానికి వీక్షణ సోర్స్ టాబ్‌ను మూసివేయండి లేదా డెవలపర్ టూల్స్ పేన్‌లోని ‘X’ క్లిక్ చేయండి.


$config[zx-auto] not found$config[zx-overlay] not found