Jak sprawdzać elementy internetowe za pomocą przeglądarki

Witryny internetowe są tworzone z linii kodu, ale wynikiem są strony zawierające obrazy, filmy, czcionki i inne funkcje. Aby zmienić jeden z tych elementów lub zobaczyć, z czego się składa, znajdź wiersz kodu, który nim steruje. Aby to zrobić, użyj narzędzia do kontroli elementów. Nie musisz pobierać narzędzia inspekcyjnego ani instalować dodatku do swojej ulubionej przeglądarki internetowej. Zamiast tego kliknij prawym przyciskiem myszy element strony, a następnie wybierz Sprawdzać or Sprawdź element. Jednak sposób uzyskiwania dostępu do tego narzędzia różni się w zależności od przeglądarki.

W tym artykule użyto kliknij prawym przyciskiem myszy aby odnieść się do działania myszy na komputerze z systemem Windows, a także do działania Control + kliknięcie na komputerze Mac.


Sprawdź elementy w Google Chrome

W Google Chrome istnieją dwa sposoby sprawdzania strony internetowej za pomocą wbudowanych narzędzi Chrome DevTools:

  • Kliknij prawym przyciskiem myszy element na stronie lub w pustym obszarze, a następnie wybierz Sprawdzać.
  • Idź do Chrom menu, a następnie wybierz Więcej narzędzi > Narzędzia Deweloperskie.

Użyj narzędzi Chrome DevTools, aby skopiować lub edytować znaczniki Hypertext Markup Language (HTML) oraz ukryć lub usunąć elementy do czasu ponownego załadowania strony.

Gdy Chrome DevTools otworzy się z boku strony, zmień jego położenie, wyskakuj ze strony, wyszukaj pliki stron, wybierz elementy ze strony, aby przyjrzeć się bliżej, skopiuj pliki i adresy URL oraz dostosuj ustawienia.

Sprawdź elementy w przeglądarce Mozilla Firefox

Mozilla Firefox ma dwa sposoby na otwarcie narzędzia do inspekcji o nazwie Inspector:

  • Kliknij prawym przyciskiem myszy element na stronie internetowej, a następnie wybierz Sprawdź element.
  • Z paska menu przeglądarki Firefox wybierz Import > Twórca stron internetowych > Inspektor,

Podczas przesuwania wskaźnika nad elementami w przeglądarce Firefox Inspector automatycznie znajduje informacje o kodzie źródłowym elementu. Po wybraniu elementu wyszukiwanie w locie zatrzymuje się i można zbadać element w oknie Inspektora.

Kliknij prawym przyciskiem myszy element, aby znaleźć obsługiwane formanty. Użyj elementów sterujących, aby edytować stronę jako znacznik HTML, kopiować lub wklejać wewnętrzne lub zewnętrzne znaczniki HTML, pokazywać właściwości Document Object Model (DOM), robić zrzut ekranu lub usuwać węzeł, stosować nowe atrybuty, zobacz Cascading Style Sheets (CSS) , i więcej.


Sprawdź elementy w Safari

Istnieje kilka sposobów sprawdzania elementów internetowych w Safari:

  • Kliknij prawym przyciskiem myszy dowolny element lub przestrzeń na stronie internetowej, a następnie wybierz Sprawdź element.
  • Idź do Rozwijać menu, a następnie wybierz Pokaż inspektora sieci.

Jeśli nie widzisz menu Develop, przejdź do safari menu i wybierz Preferencje. On zaawansowany zakładka, wybierz Pokaż menu rozwijania na pasku menu checkbox.

Wybierz poszczególne elementy na stronie internetowej, aby zobaczyć znaczniki poświęcone tej sekcji.


Sprawdź elementy w przeglądarce Internet Explorer

Podobne narzędzie do inspekcji elementów, do którego można uzyskać dostęp po włączeniu narzędzi deweloperskich, jest dostępne w programie Internet Explorer. Aby włączyć narzędzia programistyczne, naciśnij F12. Lub przejdź do Import menu i wybierz Narzędzia Deweloperskie.

Aby wyświetlić menu Narzędzia, naciśnij Alt + X.

Aby sprawdzić elementy na stronie internetowej, kliknij stronę prawym przyciskiem myszy, a następnie wybierz Sprawdź element. W narzędziu Internet Explorer Select element wybierz dowolny element strony, aby wyświetlić znaczniki HTML lub CSS. Możesz także wyłączyć lub włączyć podświetlanie elementów podczas przeglądania DOM Explorer.

Podobnie jak w przypadku innych narzędzi inspektora elementów, użyj programu Internet Explorer do wycinania, kopiowania i wklejania elementów, a także edycji znaczników HTML, dodawania atrybutów, kopiowania elementów z dołączonymi stylami i nie tylko.

Sprawdź elementy w Microsoft Edge

Zanim będziesz mógł sprawdzić elementy w Microsoft Edge, musisz włączyć kontrolę. Istnieją dwa sposoby włączenia inspekcji:

  • Przejdź do paska adresu i wpisz about: flags. W oknie dialogowym wybierz plik Pokaż źródło widoku i sprawdź element w menu kontekstowym checkbox.
  • naciśnij F12, A następnie wybierz opcję DOM Explorer.

Aby sprawdzić element, kliknij prawym przyciskiem myszy element na stronie internetowej, a następnie wybierz Sprawdź element.

Dodaj komentarz