Az elemek vizsgálata Mac, Windows, iPhone és iPad rendszeren

Az elemek vizsgálata Mac, Windows, iPhone és iPad rendszeren

A fejlesztők és a felhasználói felület tervezői az Inspect Element funkciót használják a webhelyek online módosítására a forráskód megváltoztatása nélkül. De hogyan lehet megvizsgálni az elemeket webfejlesztő tanfolyam elvégzése nélkül?

Az Inspect Element egy praktikus fejlesztői eszköz, amely a népszerű webböngészőkkel együtt kapható. Csak azt kell tudnia, hogyan telepítheti az eszközt néhány kattintással a webhelyek böngészése közben.

Számos varázstrükköt hajthat végre, például megváltoztathatja a webhely elrendezését, szöveg nélküli képernyőképeket készíthet, betűtípusokat módosíthat, számokat módosíthat stb.

Az alábbiakban egy tömör, lépésről-lépésre szóló útmutatót talál, amellyel megtanulhatja, hogyan ellenőrizheti az elemeket könnyedén.

Mi az az Inspect Element?

Az Inspect Element egy webfejlesztő eszköz, amely a legtöbb webböngészőben elérhető. Használhatja bármely meglátogatott webhely előtér-forráskódjának szerkesztésére.

A módosítások a webböngészőn belüli homokozóban történnek. Tehát nem módosít semmit a tényleges webhelyen. Ezenkívül az oldal frissítésekor a felületes módosítások eltűnnek.

Íme néhány kreatív felhasználási mód:

  • Képernyőképet kell készítenie egy webhelyről, és a képen látható szövegek zavarják Önt. Az Inspect Element eszközzel törölheti ezeket a szövegeket.
  • Meg akarja tréfálni barátait azzal, hogy megmutatja nekik a nevét a New York Timesban vagy a Washington Postban. Az Inspect Element a legjobb módja ennek.
  • Tesztelje a hibakeresési kódokat a webhelyeken az Inspect Element eszközzel valós időben történő alkalmazásával. Ha működik, módosíthatja a háttérforráskódot.
  • Digitális marketingesként felfedheti a versenytársak kulcsszavait, SEO címeit, metacímkéit stb., ezzel a hatalmas webfejlesztő eszközzel.

Hogyan ellenőrizzük az elemeket a Windows rendszeren

Az Inspect Element eszköz használata Windows rendszeren nevetségesen egyszerű. Az alábbiakban egy lépésenkénti útmutatót találhat az elemek különböző webböngészők segítségével történő ellenőrzéséhez Windows rendszeren:

Google Chrome Inspect Tool

Az elemek vizsgálata Mac, Windows, iPhone és iPad rendszeren

Elemek vizsgálata a Windows Chrome böngészőben

  • A Google Chrome használatakor kattintson a jobb gombbal bárhol a webhelyen.
  • Megjelenik a jobb gombbal kattintva helyi menü.
  • Alul az Ellenőrzés felirat látható .
  • Kattintson a Vizsgálat gombra a HTML- és CSS-kódok megtekintéséhez a jobb oldali panelen .

Hogyan nyithatom meg az Inspect Element-et a Chrome-ban jobb kattintás nélkül?

Van néhány praktikus parancsikon az Inspect Element eszköz megnyitásához a Google Chrome for Windows rendszerben. Ezek a gyorsbillentyűk az alábbiak:

  • Ctrl + Shift + C
  • Az F12 funkcióbillentyű

A fenti gyorsbillentyűk a Mozilla Windows böngészőben is működnek.

Mozilla Inspector Tool

Az elemek vizsgálata Mac, Windows, iPhone és iPad rendszeren

Az elemek ellenőrzése a Windows Mozilla böngészőben

A Mozilla böngészőben a folyamat ugyanaz, mint a Google Chrome-ban. Az Inspector ablak azonban a böngésző alján jelenik meg, nem pedig a jobb oldalon, mint a Google Chrome-ban.

Microsoft Edge Inspect Tool

Az elemek vizsgálata Mac, Windows, iPhone és iPad rendszeren

Az elemek ellenőrzése a Windows Edge böngészőben

Meglepő módon a Microsoft Edge Inspect Elementje hasonlóan működik, mint a Google Chrome böngésző. Az Inspect eszköz a jobb gombbal kattintva elérhető. Ezenkívül a HTML- és CSS-kódok a jobb oldalon jelennek meg, hasonlóan a Google Chrome-hoz.

Az elemek vizsgálata Mac rendszeren

Google Chrome-ot, Mozilla Firefoxot vagy Microsoft Edge-t használ az Apple Mac számítógépein? Ha igen, akkor telepítheti az Inspect Element eszközt a Windows szakaszban említett lépések végrehajtásával.

De ha az alapértelmezett macOS webböngészőt, a Safarit használja, akkor az Inspect Element eszköz használata trükkös játék. Alapértelmezés szerint a Safari nem jeleníti meg az Inspect Element funkciót Macen. A következőket kell tennie:

Az Inspect Element megnyitása Mac rendszeren

Először is aktiválnia kell a fejlesztői eszközöket a Safari Mac gépen. Itt van, hogyan:

  • Futtassa a Safari böngészőt .
  • Látogasson el egy webhelyre, amelyen meg szeretné tekinteni a webelemeket.
  • Válassza a Safari lehetőséget a Safari böngésző felső menüsorában.
  • A megnyíló helyi menüben kattintson a Beállítások elemre .
  • A Beállítások képernyőn válassza a Speciális lehetőséget .
  • Jelölje be a Fejlesztés megjelenítése menüt a Speciális beállítások képernyő alján .

Sikeresen engedélyezte a fejlesztői eszközöket a Safari for Mac rendszeren. Most kövesse az alábbi lépéseket az Inspect Element használatához:

  • A webhely bármely elemén, például szövegen vagy képen kattintson jobb gombbal a ikonra .
  • Megjelenik egy helyi menü. Alul az Elem vizsgálata felirat látható .
  • Kattintson rá, hogy megnyissa a HTML- és CSS- kódokat tartalmazó hibakeresési részt a webhely alatt .

Melyek az elem vizsgálatának kulcsai?

Lehet, hogy az Inspect Element parancsikonokat keres Mac rendszeren. A következőket használhatja:

  • Command + Shift + C
  • Nyomja meg a Control billentyűt, majd válasszon ki egy elemet.
  • Kattintson a görgetőpadra két ujjal

Elemek vizsgálata Chromebookokon

A Chromebook a Google Chrome-ot használja alapértelmezett böngészőként. Ezért bármely webhely megnyitása után egyszerűen kattintson a jobb gombbal, hogy megtalálja az Elem vizsgálata opciót a következő helyi menüben.

Ha munkahelyi vagy iskolai Chromebookot használ, akkor a következő kérdést teheti fel:

Miért nem tudom megvizsgálni az iskolai Chromebookomat?

A legtöbb iskolai és üzleti adminisztrátor letiltja a speciális funkciókat az általa biztosított Chromebookon munkához vagy tanuláshoz. Mivel a fejlesztői eszközök speciális funkciók, valószínű, hogy az iskolai vagy munkahelyi Chromebookon nem jelenik meg az Inspect Element eszköz.

Az elemek ellenőrzése iPad/iPhone készüléken

Sajnos az Inspect Element eszköz nem használható iPhone-on vagy iPaden Mac nélkül.

Az iOS és az iPadOS rendelkezik Web Inspectorral a Safari alkalmazáshoz. Ez azonban csak akkor működik, ha a mobileszközt egy olyan Mac számítógéphez csatlakoztatja, amelyen már aktiválta a Safari fejlesztői eszközeit. Az alábbiakban felsoroljuk azokat a lépéseket, amelyeket kipróbálhat:

  • Nyissa meg az iPad/iPhone Beállítások alkalmazást.
  • Kattintson a Safari elemre a bal oldali navigációs panelen.

Az elemek vizsgálata Mac, Windows, iPhone és iPad rendszeren

A Safari beállítások megnyitása iPaden vagy iPhone-on

  • Ezután görgessen le a jobb oldalon, és válassza ki a Speciális lehetőséget .

Az elemek vizsgálata Mac, Windows, iPhone és iPad rendszeren

A Web Inspector aktiválása iPaden és iPhone-on

  • Aktiválja a Web Inspector kapcsolóját .
  • Most csatlakoztassa a mobileszközt a Mac-hez USB segítségével .
  • Engedélyezze az iPhone/iPad készüléket Macen.
  • Nyisson meg bármilyen webhelyet egy mobileszközön a Safari alkalmazásban.
  • Most futtassa a Safarit a Mac számítógépen, és válassza a Fejlesztés lehetőséget a felső menüsorban.
  • A megnyíló helyi menüben keresse meg mobileszköze nevét.
  • Az összes megnyitott webhely megtekintéséhez vigye a kurzort a mobileszköz fölé.
  • Most válasszon ki egy webhelyet a HTML- és CSS-forráskód megtekintéséhez a Mac Safari böngészőjében.

Következtetés

Megvizsgálta az összes lehetséges módot az Inspect Element eszköz használatára a weboldalak ideiglenes szerkesztésére. Azt is megtanulta, hogyan vizsgálhatja meg az elemeket különböző eszközökön, például Macen, Windowson, Chromebookon, iPaden és iPhone-on.

Ha legközelebb szórakozásból vagy szakmai igényekből kell módosítania egy weboldalt, próbálja ki ezeket a módszereket. Minden bizonnyal szeretni fogja ezeket a könnyed lépéseket, mint a máshol leírt bonyolult módszereket.

Ne felejtsen el megjegyzéseket fűzni alább, ha a fenti lépések segítettek Önnek, ha bármilyen kihívást jelentő módszert talált, vagy bármilyen titkos tippet kaphat az Inspect Element eszközzel kapcsolatban.

Szüksége van egy weboldalra nyomtatott referenciaként? Tanulja meg, hogyan menthet gyorsan egy weboldalt PDF formátumban most!


Miért nem működik a Facebook? 9 Javítások a gyakori problémákra

Miért nem működik a Facebook? 9 Javítások a gyakori problémákra

A Facebook nem csupán egy közösségi hálózat; segít kapcsolatban maradni barátaival. Fedezze fel a Facebook problémáit és javításait most!

Elfelejtette HBO Max jelszavát? Így állíthatja vissza és állíthatja vissza

Elfelejtette HBO Max jelszavát? Így állíthatja vissza és állíthatja vissza

Ön lelkes HBO Max-figyelő, de úgy tűnik, nem emlékszik a jelszavára. Ne essen pánikba, itt megtalálja az utat a jelszó visszaállításához.

9 módszer a nem működő Facebook Messenger javítására

9 módszer a nem működő Facebook Messenger javítására

Problémái vannak a Facebook Messenger használatával iPhone-on vagy Android-telefonon. Az alkalmazás nem küldi vagy fogadja az üzeneteket.

Nem működik a Facebook-bejelentkezés hibaelhárítása

Nem működik a Facebook-bejelentkezés hibaelhárítása

Nem tud bejelentkezni a Facebook-fiókjába? Kövesse ezt a részletes hibaelhárító útmutatót.

Hogyan kereshet szót vagy szöveget egy weboldalon bármely webböngészőben

Hogyan kereshet szót vagy szöveget egy weboldalon bármely webböngészőben

A weboldal keresés neve, lehetőséget ad, hogy gyorsan megtalálja a szükséges információt. Hogyan kereshet szavakat és szövegeket hatékonyan.

15 PowerPoint-tipp és trükk a prezentációk tökéletesítéséhez

15 PowerPoint-tipp és trükk a prezentációk tökéletesítéséhez

A prezentáció készítése a PowerPointban lényegesen egyszerűbb lesz, ha ismer néhány tippet és trükköt. Fedezze fel a legjobb PowerPoint tippeket, hogy vonzóbbá tegye prezentációit!

Hogyan lehet javítani a „Nem lehet csatlakozni a világhoz” hibát a Minecraftban

Hogyan lehet javítani a „Nem lehet csatlakozni a világhoz” hibát a Minecraftban

A Minecraft hibák elkerüléséhez kövesse útmutatóinkat a „Nem lehet csatlakozni a világhoz” probléma megoldására, hogy visszatérhessen a játékhoz.

A Google Fiók jelszavának megváltoztatása vagy visszaállítása

A Google Fiók jelszavának megváltoztatása vagy visszaállítása

A Google-fiókja jelszavának megváltoztatása elengedhetetlen a biztonság megőrzéséhez.101 lépés a jelszó biztonságának növelésére.

Hogyan változtassuk meg a PSN-nevünket generátorral vagy anélkül

Hogyan változtassuk meg a PSN-nevünket generátorral vagy anélkül

A PlayStation Network felhasználónév megváltoztatása most már egyszerű. Fedezd fel a legjobb generátorokat, tippeket és trükköket, hogy tökéletes nevet válassz.

A „Még nincs közzétéve” Instagram javítása. Próbáld újra Androidon

A „Még nincs közzétéve” Instagram javítása. Próbáld újra Androidon

Ebben az útmutatóban bemutatjuk a „Még nincs közzétéve” Instagram hiba megoldását Androidon, mely zavarhatja a közzétételt. Kövesse lépéseinket a probléma gyors megoldásához.