A Google Chrome^{(Google Chrome)} nemcsak rendszeres internetfelhasználóknak készült, hanem webfejlesztőknek is, akik gyakran hoznak létre webhelyet, terveznek blogokat stb. A Google Chrome Inspect Element (Ellenőrzés) vagy Inspect (Ellenőrzés ) opciója segít a felhasználóknak megtalálni bizonyos információkat egy olyan webhelyről, amely rejtett. . Íme néhány tipp a Google Chrome^{(Google Chrome)} böngésző Inspect Elementjének használatához ^{(Inspect Element)}Windows PC -n .

Vizsgálja meg a Google Chrome elemét

1] Find hidden JavaScript/Media files

Sok webhely felugró ablakokat jelenít meg, ha a látogató 15 vagy 20 másodpercnél tovább marad a weboldalon. Vagy sokszor megnyílik egy kép, hirdetés vagy ikon, miután véletlenszerűen kattintott valahova. Ha meg szeretné találni ezeket a rejtett fájlokat egy weboldalon, használja az Inspect Element Források^(Sources) lapját . Ez egy fanézetű listát mutat a bal oldalon, amely felfedezhető.

2] Get HEX/RGB color code in Chrome

Előfordulhat, hogy megkedvelünk egy színt, és érdemes megtudni a színkódját. Könnyedén megtalálhatja az adott weboldalon használt HEX vagy RGB színkódot a ^(RGB)Google Chrome natív opciójával . Kattintson a jobb gombbal^{(Right-click)} a színre, majd kattintson a Vizsgálat^(Inspect) gombra . A színkódot legtöbbször a jobb oldalon találja meg más CSS -ekkel . Ha nem látja, akkor lehet, hogy valamilyen ingyenes színválasztó szoftvert kell használnia.

TIPP^(TIP) : Vessen egy pillantást ezekre a Color Picker online eszközökre^{(Color Picker online tools)} is.

3] Tippek a weboldalak teljesítményének javítására^{(3] Get web page performance improvement tips)}

Mindenki szeret gyorsan megnyíló weboldalon landolni. Ha weboldalát tervezi, ezt mindig szem előtt kell tartania. Számos eszköz létezik az oldalbetöltési sebesség ellenőrzésére és optimalizálására. A Google Chrome azonban egy beépített eszközzel is rendelkezik, amely lehetővé teszi a felhasználók számára, hogy tippeket kapjanak a webhely betöltési sebességének javításához. Az eszközök eléréséhez lépjen az Audits fülre, és győződjön meg arról, hogy a Hálózathasználat^{(Network Utilization)} , a Weboldal teljesítménye^{(Web Page Performance)} , valamint az Oldal újratöltése és az Ellenőrzés betöltéskor^{(Reload Page and Audit on Load)} lehetőség van kiválasztva. Ezután kattintson a Futtatás^{(Run )} gombra. Ez újratölti az oldalt, és megmutat néhány információt, amelyek segítségével gyorsabbá teheti az oldalt. Például megszerezheti az összes olyan erőforrást, amelyeknek nincs lejárata a gyorsítótárban ( JavaScript ).amelyek egy fájlba kombinálhatók stb.

4] Ellenőrizze a válaszkészséget^{(4] Check responsiveness)}

A weboldalak reszponzívvá tétele manapság kulcsfontosságú. Rengeteg eszköz áll rendelkezésre, amelyek ellenőrizhetik, hogy webhelye teljesen reszponzív-e vagy sem. A Google Chrome^{(Google Chrome)} ezen eszköze azonban segít a felhasználóknak megtudni, hogy a webhely reszponzív-e vagy sem , valamint ellenőrizni tudja, hogyan nézne ki egy adott mobileszközön. Nyisson meg egy webhelyet, nyissa meg az Elem^{(Inspect Element )} vizsgálata lapot, kattintson a mobilgombra^{(mobile )} , állítsa be a felbontást, vagy válassza ki a kívánt eszközt a weboldal teszteléséhez.

5] Élő webhely szerkesztése^{(5] Edit live website)}

Tételezzük fel, hogy egy weboldalt hoz létre, de zavarban van a színséma vagy a navigációs menü mérete, illetve a tartalom vagy az oldalsáv aránya miatt. Szerkesztheti élő webhelyét a Google Chrome Inspect Element opciójával . Bár élő webhelyen nem mentheti el a változtatásokat, minden szerkesztést elvégezhet, hogy tovább tudja használni. Ehhez nyissa meg az Elem vizsgálata^{(Inspect Element)} lehetőséget , válassza ki a HTML tulajdonságot a bal oldalon, és hajtsa végre a stílusmódosításokat a jobb oldalon. Ha módosít a CSS -ben, kattintson a fájl hivatkozására, másolja ki a teljes kódot, és illessze be az eredeti fájlba.

Az Inspect Element^{(Inspect Element)} of Google Chrome minden webfejlesztő igazi társa. Nem számít, hogy egyoldalas vagy dinamikus webhelyet fejleszt, ezeket a tippeket biztosan használhatja.

Tips on using the Inspect Element of Google Chrome browser

Google Chrome is designed not just for regular intеrnet users but alsо for web developers, who often сrеate a website, design blogs, etc. The Inspect Element or Inspect option of Google Chrome assists users to find some information about a website that is hidden from view. Here are some tips on using the Inspect Element of Google Chrome browser for Windows PC.

Inspect Element of Google Chrome

1] Find hidden JavaScript/Media files

Many websites show popups if the visitor stays on the web page for more than 15 or 20 seconds. Or, many times an image, ad or icon, opens after clicking somewhere randomly. To find these hidden files on a web page, you can make use of the Sources tab of Inspect Element. It shows a tree-view list on the left-hand side that can be explored.

2] Get HEX/RGB color code in Chrome

Sometimes we may like a color and may want to find out its color code. You can easily find the HEX or RGB color code used on a particular web page, using the native option in Google Chrome. Right-click on the color, and click on Inspect. Most of the time, you will get the color code on the right-hand side with other CSS. If you do not see it, well, you may have to use some free color picker software.

TIP: Take a look at these Color Picker online tools too.

3] Get web page performance improvement tips

Everyone loves to land on a website that opens fast. If you are designing your website, you should always keep that in mind. There are many tools to check and optimize page loading speed. However, Google Chrome also comes with an inbuilt tool that allows users to get tips to improve the website loading speed. To access these tools, go to Audits tab, and make sure Network Utilization, Web Page Performance, and Reload Page and Audit on Load are selected. Then click on Run button. It will reload the page, and show you some information that can be used to make the page faster. For instance, you can get all the resources those are not having any cache expiration, JavaScript that can be combined into one file, and so on.

4] Check responsiveness

Making a web page responsive is crucial, nowadays. There are loads of tools that can check whether your site is completely responsive or not. However, this tool of Google Chrome helps users to know whether the site is responsive or not as well as check how it would look on a particular mobile device. Open any website, get Inspect Element tab, click on the mobile button, set the resolution, or select the desired device to test the web page.

5] Edit live website

Let’s assume that you are creating a web page, but you are confused about the color scheme or navigation menu size or content or sidebar ratio. You can edit your live website using the Inspect Element option of Google Chrome. Although you cannot save the changes on a live website, you can get carry out all the editing so that you can use it further. To do so, open Inspect Element, select the HTML property from the left-hand side and make styling changes on the right-hand side. If you make any change in CSS, you can click on the file link, copy the entire code and paste that into the original file.

Inspect Element of Google Chrome is a real companion of every web developer. It doesn’t matter whether you are developing a one-page website or a dynamic website, you can certainly use these tips.

Related posts

• A Google Chrome nem válaszol. Újraindítja most?

• A fájlletöltési hibák kijavítása a Google Chrome böngészőben

• Az alapértelmezett nyomtatási beállítások módosítása a Google Chrome-ban

• Hogyan lehet megsemmisíteni a profilt a böngésző bezárásakor a Google Chrome-ban

• Az Anna Asszisztens tökéletes hangasszisztens a Google Chrome-hoz

• Javítsa ki az ERR_SPDY_PROTOCOL_ERROR hibát a Google Chrome-ban

• Az alapértelmezett betűméret megváltoztatása a Google Chrome böngészőben

• Google Chrome könyvjelzők importálása vagy exportálása HTML-fájlba

• Lapkezelő bővítmények a Google Chrome termelékenységének növelése érdekében

• A legjobb YouTube-bővítmények a Google Chrome-hoz az élmény javítása érdekében

• A Google Chrome letöltései 100%-ban elakadtak

• Tiltsa le a Profilkezelőt a Google Chrome-ban a Windows 11/10 rendszeren

• Az Olvasólista engedélyezése és használata a Google Chrome-ban

• A Google Chrome gyorsítótárra vár – mit tegyek!?

• Javítsa ki az ERR_CACHE_MISS hibaüzenetet a Google Chrome-ban

• A Google Chrome nem törli a böngészési előzményeket és az adatokat

• A lapok görgetőgombjainak engedélyezése vagy letiltása a Google Chrome-ban

• A Google Chrome telepítése a Windows PowerShell használatával

• Video sebességvezérlő Mozilla Firefox és Google Chrome számára

• Hogyan akadályozhatja meg, hogy a felhasználók bővítményeket telepítsenek a Google Chrome-ba