Chrome DevTools खोलें

Chrome DevTools को खोलने के कई तरीके हैं. इस पूरी जानकारी में से अपना पसंदीदा तरीका चुनें.

Chrome के यूज़र इंटरफ़ेस (यूआई) या कीबोर्ड का इस्तेमाल करके, DevTools को ऐक्सेस किया जा सकता है:

• Chrome में ड्रॉप-डाउन मेन्यू से.
• खास तौर पर ऐसे शॉर्टकट के साथ जो एलिमेंट, कंसोल या इस्तेमाल किए गए आखिरी पैनल को खोलते हैं.

इसके अलावा, हर नए टैब के लिए DevTools अपने-आप खोलने का तरीका जानें.

Chrome मेन्यू से DevTools खोलें

अगर आपको यूज़र इंटरफ़ेस (यूआई) पसंद है, तो Chrome के ड्रॉप-डाउन मेन्यू से DevTools को ऐक्सेस किया जा सकता है.

डीओएम या सीएसएस की जांच करने के लिए एलिमेंट पैनल खोलें

जांच करने के लिए, पेज पर मौजूद किसी एलिमेंट पर राइट क्लिक करें और जांच करें चुनें.

DevTools एलिमेंट पैनल खोलता है और डीओएम ट्री में एलिमेंट चुनता है. स्टाइल पैनल में, चुने गए एलिमेंट पर लागू किए गए सीएसएस नियम देखे जा सकते हैं.

Chrome के मुख्य मेन्यू से इस्तेमाल किया गया आखिरी पैनल खोलें

आखिरी DevTools पैनल खोलने के लिए, पता बार की दाईं ओर मौजूद बटन पर क्लिक करें. इसके बाद, ज़्यादा टूल > डेवलपर टूल चुनें.

इसके अलावा, आखिरी पैनल खोलने के लिए शॉर्टकट का इस्तेमाल किया जा सकता है. ज़्यादा जानने के लिए, अगला सेक्शन देखें.

शॉर्टकट का इस्तेमाल करके पैनल खोलना: एलिमेंट, कंसोल या आखिरी पैनल

अगर आपको कीबोर्ड पसंद है, तो अपने ऑपरेटिंग सिस्टम के आधार पर, Chrome में कोई शॉर्टकट दबाएं:

ओएस	एलिमेंट	कंसोल	आपका आखिरी पैनल
Windows या Linux	Ctrl Shift C	Ctrl Shift J	F12 Ctrl Shift I
Mac	Cmd Option C	Cmd Option J	Fn F12 Cmd Option I

यहां शॉर्टकट को याद रखने का आसान तरीका दिया गया है:

• C का मतलब है सीएसएस.
• JavaScript के लिए J दबाएं.
• मैं आपकी पसंद को तय करता है.

C शॉर्टकट, इंस्पेक्टर मोड में एलिमेंट पैनल खोलता है. किसी पेज पर एलिमेंट पर कर्सर घुमाने पर, इस मोड में आपको मददगार टूलटिप दिखती हैं. किसी भी एलिमेंट पर क्लिक करके, उसके सीएसएस को एलिमेंट > स्टाइल पैनल में देखा जा सकता है.

DevTools शॉर्टकट की पूरी सूची देखने के लिए, कीबोर्ड शॉर्टकट देखें.

हर नए टैब पर DevTools अपने-आप खोलें

कमांड लाइन से Chrome चलाएं और --auto-open-devtools-for-tabs फ़्लैग को पास करें:

1. चल रहे किसी भी Chrome इंस्टेंस से बाहर निकलें.

2. अपना पसंदीदा टर्मिनल या कमांड लाइन ऐप्लिकेशन चलाएं.

3. अपने ऑपरेटिंग सिस्टम के आधार पर, नीचे दिए गए निर्देश को चलाएं:

• MacOS पर:

  open -a "Google Chrome" --args --auto-open-devtools-for-tabs
  

• Windows:

  start chrome --auto-open-devtools-for-tabs
  

• Linux:

  google-chrome --auto-open-devtools-for-tabs
  

DevTools तब तक हर नए टैब के लिए अपने-आप खुलेगा, जब तक Chrome को बंद नहीं किया जाता.

आगे क्या करना है?

DevTools नेविगेशन के लिए कुछ काम के शॉर्टकट और सेटिंग के बारे में जानने के लिए, नीचे दिया गया वीडियो देखें.

बेहतर तरीके से सीखने के लिए, DevTools को पसंद के मुताबिक बनाने का तरीका देखें.