ਕਿਸੇ ਵੀ ਵੈਬ ਪੇਜ ਦੇ HTML ਅਤੇ CSS ਵੇਖੋ
ਇਹ ਵੈੱਬਸਾਈਟ ਕੋਡ ਦੀਆਂ ਲਾਈਨਾਂ ਨਾਲ ਬਣੀ ਹੋਈ ਹੈ, ਪਰ ਨਤੀਜਾ ਇਹ ਹੈ ਕਿ ਚਿੱਤਰ, ਵੀਡੀਓ, ਫੌਂਟਾਂ ਅਤੇ ਹੋਰ ਬਹੁਤ ਸਾਰੇ ਸਫੇ ਹਨ. ਇਹਨਾਂ ਵਿੱਚੋਂ ਇੱਕ ਤੱਤਾਂ ਨੂੰ ਬਦਲਣ ਲਈ ਜਾਂ ਵੇਖੋ ਕਿ ਇਹ ਕੀ ਬਣਿਆ ਹੈ, ਤੁਹਾਨੂੰ ਕੋਡ ਦੀ ਵਿਸ਼ੇਸ਼ ਲਾਈਨ ਲੱਭਣੀ ਪਵੇਗੀ ਜੋ ਉਸ ਤੇ ਕਾਬੂ ਪਾਉਂਦੀ ਹੈ. ਤੁਸੀਂ ਅਜਿਹਾ ਇਕ ਤੱਤ ਜਾਂਚ ਸਾਧਨ ਨਾਲ ਕਰ ਸਕਦੇ ਹੋ.
ਜ਼ਿਆਦਾਤਰ ਵੈਬ ਬ੍ਰਾਊਜ਼ਰ ਤੁਹਾਨੂੰ ਕਿਸੇ ਇੰਸਪੈਕਸ਼ਨ ਟੂਲ ਨੂੰ ਡਾਉਨਲੋਡ ਨਹੀਂ ਕਰਦੇ ਜਾਂ ਐਡ-ਆਨ ਇੰਸਟਾਲ ਨਹੀਂ ਕਰਦੇ ਹਨ. ਇਸ ਦੀ ਬਜਾਏ, ਉਹ ਤੁਹਾਨੂੰ ਸਫ਼ੇ ਦੇ ਤੱਤ ਤੇ ਸੱਜਾ-ਕਲਿਕ ਕਰਦੇ ਹਨ ਅਤੇ ਤੱਤ ਜਾਂਚ ਜਾਂ ਜਾਂਚ ਕਰਦੇ ਹਨ . ਹਾਲਾਂਕਿ, ਇਹ ਪ੍ਰਕਿਰਿਆ ਤੁਹਾਡੇ ਬ੍ਰਾਊਜ਼ਰ ਵਿੱਚ ਥੋੜ੍ਹਾ ਵੱਖਰੀ ਹੋ ਸਕਦੀ ਹੈ.
Chrome ਵਿੱਚ ਐਲੀਮੈਂਟਸ ਦੀ ਜਾਂਚ ਕਰੋ
Google Chrome ਦੇ ਸਭ ਤੋਂ ਨਵੇਂ ਸੰਸਕਰਣਾਂ ਵਿੱਚ ਤੁਸੀਂ ਪੰਨੇ ਨੂੰ ਕੁਝ ਤਰੀਕਿਆਂ ਨਾਲ ਨਿਰੀਖਣ ਕਰ ਸਕਦੇ ਹੋ, ਜੋ ਸਾਰੇ ਇਸਦੇ ਬਿਲਟ-ਇਨ Chrome DevTools ਵਰਤਦੇ ਹਨ:
- ਸਫ਼ੇ (ਜਾਂ ਇੱਕ ਖਾਲੀ ਖੇਤਰ) ਤੇ ਕੁਝ ਨੂੰ ਸੱਜਾ ਬਟਨ ਦਬਾਓ ਅਤੇ ਇਨਸਪੈਕਟ ਚੁਣੋ
- Ctrl + Shift + I ਕੀਬੋਰਡ ਸ਼ਾਰਟਕੱਟ ਦਿਓ
- ਹੋਰ ਸੰਦਾਂ> ਵਿਕਾਸਕਾਰ ਸੰਦਾਂ ਦੀ ਚੋਣ ਕਰਨ ਲਈ Chrome ਮੀਨੂ ਦੀ ਵਰਤੋਂ ਕਰੋ
Chrome DevTools ਤੁਹਾਨੂੰ ਚੀਜ਼ਾਂ ਦੀ ਸੌਖੀ ਤਰ੍ਹਾਂ ਕਾਪੀ ਕਰਨ ਜਾਂ HTML ਲਾਈਨਾਂ ਨੂੰ ਸੰਪਾਦਤ ਕਰਨ ਜਾਂ ਚੀਜ਼ਾਂ ਨੂੰ ਪੂਰੀ ਤਰ੍ਹਾਂ ਲੁਕਾਉਣ ਜਾਂ ਮਿਟਾਉਣ ਦੀ ਆਗਿਆ ਦਿੰਦਾ ਹੈ (ਸਫ਼ਾ ਰੀਲੋਡ ਹੋਣ ਤੱਕ).
ਇਕ ਵਾਰ ਜਦੋਂ DevTools ਸਫ਼ੇ ਦੇ ਪਾਸੇ ਖੁਲ੍ਹਦਾ ਹੈ, ਤਾਂ ਤੁਸੀਂ ਇਸ ਨੂੰ ਕਿੱਥੇ ਸਥਾਪਿਤ ਕਰ ਸਕਦੇ ਹੋ, ਇਸ ਨੂੰ ਪੰਨੇ ਤੋਂ ਬਾਹਰ ਕਰ ਸਕਦੇ ਹੋ, ਸਾਰੇ ਪੰਨੇ ਦੀਆਂ ਫਾਈਲਾਂ ਦੀ ਖੋਜ ਕਰ ਸਕਦੇ ਹੋ, ਵਿਸ਼ੇਸ਼ ਜਾਂਚ ਲਈ ਪੰਨੇ ਤੋਂ ਤੱਤ ਚੁਣ ਸਕਦੇ ਹੋ, ਫਾਈਲਾਂ ਅਤੇ URL ਦੀ ਕਾਪੀ ਕਰ ਸਕਦੇ ਹੋ, ਸੈਟਿੰਗ ਦੇ.
ਫਾਇਰਫਾਕਸ ਵਿਚ ਐਲੀਮੈਂਟਸ ਦੀ ਜਾਂਚ ਕਰੋ
Chrome ਵਾਂਗ, ਫਾਇਰਫਾਕਸ ਵਿੱਚ ਇੰਸਪੈਕਟਰ ਨਾਂ ਦੇ ਸੰਦ ਨੂੰ ਖੋਲਣ ਦੇ ਕੁਝ ਵੱਖਰੇ ਤਰੀਕੇ ਹਨ:
- ਪੰਨੇ 'ਤੇ ਇੱਕ ਖਾਲੀ ਖੇਤਰ' ਤੇ ਸੱਜਾ-ਕਲਿੱਕ ਕਰੋ ਜਾਂ ਕਿਸੇ ਤੱਤ ਦੀ ਚੋਣ ਕਰੋ ਅਤੇ ਐਲੀਮੈਂਟ ਦੀ ਜਾਂਚ ਕਰੋ ਚੁਣੋ
- ਕੀਬੋਰਡ ਨਾਲ Ctrl + Shift + T ਜਾਂ Ctrl + Shift + I ਦਾਖਲ ਕਰੋ
- ਫਾਇਰਫਾਕਸ ਮੀਨੂੰ ਤੋਂ, ਡਿਵੈਲਪਰ > ਇੰਸਪੈਕਟਰ ਕਲਿੱਕ ਕਰੋ
- ਸੰਦ ਮੇਨੂ ਤੋਂ, ਵੈੱਬ ਡਿਵੈਲਪਰ> ਇੰਸਪੈਕਟਰ ਕਲਿੱਕ ਕਰੋ
ਜਦੋਂ ਤੁਸੀਂ ਆਪਣਾ ਮਾਊਸ ਫਾਇਰਫਾਕਸ ਦੇ ਵੱਖ-ਵੱਖ ਐਲੀਮੈਂਟਸ ਉੱਤੇ ਲੈ ਜਾਂਦੇ ਹੋ, ਇੰਸਪੈਕਟਰ ਟੂਲ ਆਟੋਮੈਟਿਕ ਹੀ ਤੱਤ ਦੇ ਸਰੋਤ ਕੋਡ ਦੀ ਜਾਣਕਾਰੀ ਪ੍ਰਾਪਤ ਕਰਦਾ ਹੈ. ਇਕ ਤੱਤ 'ਤੇ ਕਲਿਕ ਕਰੋ ਅਤੇ "ਆਨ-ਫਲਾਈ ਖੋਜ" ਰੋਕਿਆ ਜਾਏਗਾ ਅਤੇ ਤੁਸੀਂ ਇੰਸਪੈਕਟਰ ਵਿੰਡੋ ਤੋਂ ਤੱਤ ਦੀ ਜਾਂਚ ਕਰ ਸਕਦੇ ਹੋ.
ਸਾਰੇ ਸਮਰਥਿਤ ਨਿਯੰਤਰਣਾਂ ਨੂੰ ਲੱਭਣ ਲਈ ਕਿਸੇ ਇਕਾਈ 'ਤੇ ਸੱਜਾ-ਕਲਿਕ ਕਰੋ ਤੁਸੀਂ ਪੰਨੇ ਨੂੰ HTML ਦੇ ਰੂਪ ਵਿੱਚ ਸੰਪਾਦਿਤ ਕਰਨਾ, ਅੰਦਰੂਨੀ ਜਾਂ ਬਾਹਰੀ HTML ਕੋਡ ਨੂੰ ਪੇਪ ਕਰ ਸਕਦੇ ਹੋ, ਡੋਮ ਸੰਪਤੀਆਂ, ਸਕ੍ਰੀਨਸ਼ੌਟ ਦਿਖਾ ਸਕਦੇ ਹੋ ਜਾਂ ਨੋਡ ਨੂੰ ਮਿਟਾ ਸਕਦੇ ਹੋ, ਨਵੇਂ ਗੁਣਾਂ ਨੂੰ ਆਸਾਨੀ ਨਾਲ ਲਾਗੂ ਕਰ ਸਕਦੇ ਹੋ, ਸਾਰੇ ਸਫੇ ਦੇ CSS ਵੇਖੋ ਅਤੇ ਹੋਰ ਵੀ ਬਹੁਤ ਕੁਝ ਕਰ ਸਕਦੇ ਹੋ.
ਓਪੇਰਾ ਵਿੱਚ ਐਲੀਮੈਂਟਸ ਦੇਖੋ
ਓਪੇਰਾ ਤੱਤਾਂ ਦਾ ਵੀ ਨਿਰੀਖਣ ਕਰ ਸਕਦਾ ਹੈ, ਇਸਦੇ DOM ਇੰਸਪੈਕਟਰ ਦੇ ਨਾਲ, ਜੋ ਕਿ Chrome ਦੇ ਸਮਾਨ ਹੈ. ਇਸ ਨੂੰ ਪ੍ਰਾਪਤ ਕਰਨਾ ਹੈ:
- ਕੀਬੋਰਡ ਸ਼ੌਰਟਕਟ Ctrl + Shift + I ਨੂੰ ਵਰਤੋਂ
- ਮੇਨੂ ਤੇ ਜਾਓ > ਹੋਰ ਸੰਦ> ਡਿਵੈਲਪਰ ਮੀਨੂ ਵੇਖੋ , ਅਤੇ ਫਿਰ ਮੀਨੂ> ਵਿਕਾਸਕਾਰ> ਵਿਕਾਸਕਾਰ ਟੂਲਸ ਦੁਆਰਾ ਮੀਨੂ ਖੋਲ੍ਹੋ
- ਪੰਨੇ 'ਤੇ ਕਿਸੇ ਵੀ ਤੱਤ' ਤੇ ਸੱਜੇ-ਕਲਿਕ ਮੀਨੂ ਤੋਂ, ਤੱਤ ਜਾਂਚ ਕਰੋ ਚੁਣੋ
ਇੰਟਰਨੈਟ ਐਕਸਪਲੋਰਰ ਵਿੱਚ ਐਲੀਮੈਂਟਸ ਦੀ ਜਾਂਚ ਕਰੋ
ਇਕੋ ਜਿਹੀ ਨਿਰੀਖਣ ਤੱਤ ਸੰਦ, ਜਿਸਨੂੰ ਡਿਵੈਲਪਰ ਟੂਲ ਕਹਿੰਦੇ ਹਨ, ਇੰਟਰਨੈਟ ਐਕਸਪਲੋਰਰ ਵਿਚ ਉਪਲਬਧ ਹੈ:
- ਕੀਬੋਰਡ ਤੇ F12 ਦਬਾਉ
- ਟੂਲਸ> ਐਫ 12 ਡਿਵੈਲਪਰ ਮੀਨੂ ਵਿਕਲਪ ਵਰਤੋ (ਜੇ ਤੁਸੀਂ ਟੂਲਸ ਮੀਨੂ ਨਹੀਂ ਵੇਖਦੇ ਤਾਂ Alt + X ਦਬਾਓ)
- ਪੇਜ 'ਤੇ ਸੱਜਾ-ਕਲਿਕ ਕਰੋ ਅਤੇ ਐਲੀਮੈਂਟ ਦੇਖੋ
IE ਵਿੱਚ ਇਸ ਨਵੇਂ ਮੀਨੂੰ ਵਿੱਚ ਇਕ ਐਲੀਮੈਂਟ ਟੂਲ ਹੈ ਜਿਸ ਨਾਲ ਤੁਸੀਂ ਇਸਦੇ HTML ਅਤੇ CSS ਵੇਰਵਿਆਂ ਨੂੰ ਵੇਖਣ ਲਈ ਕਿਸੇ ਵੀ ਪੇਜ ਐਲੀਮੈਂਟ ਤੇ ਕਲਿਕ ਕਰ ਸਕਦੇ ਹੋ. ਤੁਸੀਂ DOM ਐਕਸਪਲੋਰਰ ਟੈਬ ਰਾਹੀਂ ਬ੍ਰਾਉਜ਼ਿੰਗ ਕਰਦੇ ਹੋਏ ਤੱਤ ਹਾਈਲਾਇਟਿੰਗ ਨੂੰ ਅਸਾਨੀ ਨਾਲ / ਸਮਰੱਥ ਕਰ ਸਕਦੇ ਹੋ.
ਉਪਰੋਕਤ ਬ੍ਰਾਊਜ਼ਰਾਂ ਵਿੱਚ ਹੋਰ ਤੱਤ ਇੰਸਪੈਕਟਰ ਟੂਲਸ ਵਾਂਗ, ਇੰਟਰਨੈੱਟ ਐਕਸਪਲੋਰਰ ਤੁਹਾਨੂੰ ਐਲੀਮੈਂਟ ਨੂੰ ਕੱਟ, ਕਾਪੀ ਅਤੇ ਪੇਸਟ ਕਰਨ ਦੇ ਨਾਲ ਨਾਲ ਐਚਟੀਐਮ ਨੂੰ ਸੰਪਾਦਤ ਕਰਨ, ਗੁਣਾਂ ਨੂੰ ਜੋੜਨ, ਸਟਾਈਲ ਨਾਲ ਜੁੜੀਆਂ ਸਟੈਪਾਂ ਦੀ ਕਾਪੀ, ਅਤੇ ਹੋਰ ਵੀ ਬਹੁਤ ਕੁਝ ਦਿੰਦਾ ਹੈ.