Hivatal

Tippek a Google Chrome böngésző ellenőrzési elemének használatához

Week 9, continued

Week 9, continued

Tartalomjegyzék:

Anonim

A Google Chrome nemcsak a rendszeres internethasználók számára készült, hanem a webfejlesztők számára is, akik gyakran létrehoznak egy webhelyet, tervezési blogokat stb. A Inspect Element A vagy a Check lehetőség a Google Chrome segíti a felhasználókat, hogy olyan információkat találjanak a webhelyről, amely el van rejtve a nézetből. Íme néhány tipp a Google Chrome böngésző ellenőrző elemének Windows PC-hez való használatához.

A Google Chrome elemének ellenőrzése

1] Rejtett JavaScript / médiafájlok keresése

Sok weboldal megmutatja az előugró ablakokat, ha a látogató az interneten marad oldal több mint 15 vagy 20 másodpercig. Vagyis véletlenszerűen kattintva kinyit egy képet, hirdetést vagy ikont. A weblap rejtett fájljainak megkereséséhez használhatja az Inspect Element Források lapját.

2] Get HEX / RGB színkód a Chrome

Néha tetszeni fogunk egy színnek, és szeretnénk kideríteni a színkódját. Könnyedén megtalálhatja az adott weboldalon használt HEX vagy RGB színkódot a natív beállítás használatával a Google Chrome-ban. Kattintson a jobb gombbal a színre, majd kattintson a Inspect gombra. Az esetek többségében a jobb oldali színkódot a többi CSS segítségével kapja meg. Ha nem látja, akkor lehet, hogy valamilyen ingyenes színválasztó szoftvert kell használnia.

TIP : Tekintse meg ezeket a színválasztó online eszközöket is.

3]

Mindenki szeret egy olyan weboldalon, amely gyorsan megnyílik. Ha tervezed a webhelyedet, ezt mindig szem előtt kell tartanod. Számos eszközzel ellenőrizheti és optimalizálhatja az oldal betöltési sebességét. A Google Chrome ugyanakkor beépített eszközzel is rendelkezik, amely lehetővé teszi a felhasználók számára, hogy tippeket találjanak a webhelyek betöltési sebességének javítására. Az eszközök eléréséhez lépjen a Auditálások fülre, és győződjön meg róla, hogy a Hálózathasznosítás , Weboldal teljesítmény és Oldal újratöltése és ellenőrzés a betöltésnél van kiválasztva. Ezután kattintson a Futtatás gombra. Újratölti az oldalt, és megmutatja neked néhány információt, amelyek segítségével gyorsabban elkészítheti az oldalt. Például kaphat minden olyan erőforrást, amelyiknek nincs cache-lejárata, egy fájlba kombinálható JavaScript, stb.

4] Ellenőrizze a válaszidőt

Manapság fontos a weboldal megfelelősége. Számos eszközzel lehet ellenőrizni, hogy webhelye teljes mértékben reagál-e vagy sem. A Google Chrome ezen eszköze azonban segít a felhasználóknak tudni, hogy a webhely reagál-e vagy sem, és ellenőrizze, hogyan néz ki egy adott mobileszközön. Nyisson meg bármilyen weboldalt, kap Inspect Element lapot, kattintson a mobile gombot, állítsa be a felbontást, vagy válassza ki a kívánt eszközt a weboldal teszteléséhez.

5] Élő weboldal szerkesztése

Tegyük fel, hogy weblapot hoz létre, de zavaros a szín sémát vagy navigációs menüket, vagy a tartalom vagy oldalsáv arányát. Az élő weboldalt szerkesztheti a Google Chrome ellenőrzési elemével. Bár nem lehet menteni a változtatásokat egy élő weboldalon, elvégezheti az összes szerkesztést, hogy tovább használhassa. Ehhez nyissa meg a Inspect Elem elemet, válassza ki a bal oldali HTML tulajdonságot, és módosítsa a stílus módosításait a jobb oldalon. Ha bármilyen változtatást hajt végre a CSS-ben, kattintson a fájl linkjére, másolja át a teljes kódot, és illessze be az eredeti fájlt.

A Google Chrome elemének ellenőrzése minden webfejlesztő valódi társa. Nem számít, hogy egyoldalas weboldalt vagy dinamikus weboldalt fejlesztesz, biztosan használhatja ezeket a tippeket.