Jak wyświetlić źródło HTML w przeglądarce Google Chrome

Co wiedzieć

• Kliknij stronę internetową prawym przyciskiem myszy i wybierz Zobacz stronę źródłową .
• Skrót: naciśnij klawisz kontrolny + W (komputer z systemem Windows) lub Komenda + Opcja + W (Prochowiec).
• Aby skorzystać z narzędzi programistycznych Chrome, wybierz Menu (trzy kropki) > Więcej narzędzi > Narzędzia deweloperskie .

W tym artykule wyjaśniono, jak uzyskać dostęp do kodu źródłowego HTML witryny internetowej w przeglądarce Google Chrome, a także uzyskać dostęp do narzędzi programistycznych Chrome i z nich korzystać. Przeglądanie kodu źródłowego witryny to doskonały sposób na naukę HTML dla początkujących.

Wyświetl kod źródłowy w przeglądarce Chrome

Jak zatem przeglądać kod źródłowy strony internetowej? Oto instrukcje krok po kroku, jak to zrobić za pomocą przeglądarki Google Chrome.

1. Otworzyć Przeglądarka internetowa Google Chrome (Jeśli nie masz Zainstalowana przeglądarka Google Chrome , To jest darmowe pobranie).

2. Przejdź do stronę internetową, którą chcesz sprawdzić .

3. Kliknij prawym przyciskiem myszy Strona i spójrz na menu, które się pojawi. Z tego menu kliknij Zobacz stronę źródłową .

   

4. Kod źródłowy tej strony pojawi się teraz jako nowa karta w przeglądarce.

5. Alternatywnie możesz także użyć skrótów klawiaturowych klawisz kontrolny + W na komputerze PC, aby otworzyć okno z wyświetlonym kodem źródłowym witryny. Na komputerze Mac ten skrót to Komenda + Opcja + W .

Hilary Allison / Lifewire

jak upewnić się, że wszystkie sterowniki są aktualne

Skorzystaj z Narzędzi dla programistów Chrome

Oprócz prostychZobacz stronę źródłowąmożliwości, jakie oferuje Google Chrome, możesz także skorzystać z ich doskonałych funkcji Narzędzia deweloperskie aby zagłębić się w witrynę. Narzędzia te pozwolą Ci nie tylko zobaczyć kod HTML, ale także CSS, który ma zastosowanie do elementów widoku w tym dokumencie HTML.

Aby skorzystać z narzędzi programistycznych Chrome:

1. otwarty GoogleChrome .

2. Nawigować do stronę internetową, którą chcesz sprawdzić .

3. Wybierz menu z trzema kropkami w prawym górnym rogu okna przeglądarki.

4. W menu najedź kursorem Więcej narzędzi a następnie wybierz Narzędzia deweloperskie w wyświetlonym menu.

   

5. Otworzy się okno pokazujące kod źródłowy HTML po lewej stronie panelu i powiązany CSS po prawej.

6. Alternatywnie, jeśli klikniesz prawym przyciskiem myszy element strony internetowej i wybierz Sprawdzać z menu, które się pojawi, pojawią się narzędzia programistyczne Chrome i podświetlą wybraną część kodu HTML z odpowiednim CSS pokazanym po prawej stronie. Jest to bardzo pomocne, jeśli chcesz dowiedzieć się więcej o konkretnym fragmencie witryny.

   jak stworzyć serwer lan na odwróconym

Czy przeglądanie kodu źródłowego jest legalne?

Przez lata wielu nowych projektantów stron internetowych zadawało sobie pytanie, czy dopuszczalne jest przeglądanie kodu źródłowego witryny i wykorzystywanie go do celów edukacyjnych, a ostatecznie do wykonywanej przez nich pracy. Chociaż hurtowe kopiowanie kodu witryny i podawanie go jako własnego w witrynie internetowej jest z pewnością niedopuszczalne, używanie tego kodu jako odskoczni do nauki pokazuje, jak wiele postępów poczyniono w tej branży.

Jak wspomnieliśmy na początku tego artykułu, trudno byłoby dziś znaleźć pracującego specjalistę internetowego, który nie nauczyłby się czegoś, przeglądając źródła witryny! Tak, przeglądanie kodu źródłowego witryny jest legalne. Używanie tego kodu jako zasobu do zbudowania czegoś podobnego jest również bezpieczne. Biorąc kod w niezmienionej postaci i przekazując go jako swoją pracę, zaczynasz napotykać problemy.

W końcu profesjonaliści zajmujący się internetem uczą się od siebie nawzajem i często udoskonalają prace, które widzą i którymi się inspirują, dlatego nie wahaj się zapoznać z kodem źródłowym witryny i wykorzystać go jako narzędzie do nauki.

Więcej niż tylko HTML

Należy pamiętać, że pliki źródłowe mogą być bardzo skomplikowane (a im bardziej złożona jest przeglądana witryna, tym bardziej skomplikowany może być jej kod). Oprócz struktury HTML, z której składa się strona, dostępne będą również CSS (kaskadowe arkusze stylów), które określają wygląd witryny. Ponadto wiele współczesnych witryn internetowych zawiera pliki skryptów wraz z kodem HTML.

Prawdopodobnie będzie dołączonych wiele plików skryptów; w rzeczywistości każdy z nich obsługuje inne aspekty witryny. Szczerze mówiąc, kod źródłowy witryny może wydawać się przytłaczający, zwłaszcza jeśli dopiero zaczynasz to robić. Nie denerwuj się, jeśli nie możesz od razu dowiedzieć się, co się dzieje z daną witryną. Wyświetlenie źródła HTML to dopiero pierwszy krok w tym procesie. Przy odrobinie doświadczenia zaczniesz lepiej rozumieć, jak wszystkie te elementy pasują do siebie, tworząc stronę internetową, którą widzisz w przeglądarce. Gdy lepiej zaznajomisz się z kodem, będziesz mógł dowiedzieć się z niego więcej i nie będzie ci się to wydawać takie trudne.

• Jak edytować kod HTML w przeglądarce Chrome?

  Otwórz Narzędzia programistyczne w przeglądarce Chrome, naciskając klawisz kontrolny (Lub Komenda na komputerze Mac) + Shift + I . Stamtąd naciśnij klawisz kontrolny ( Komenda na Macu) + O i wybierz zapisany plik źródłowy, który chcesz edytować, aby go otworzyć.

• Jak wyświetlić kod źródłowy strony w przeglądarce Chrome, jeśli opcja Wyświetl źródło jest wyłączona?

  Jeśli witryna internetowa wyłączyła opcję Wyświetl źródło, nadal możesz zajrzeć pod maskę. W górnej części okna przeglądarki wybierz Pogląd > Deweloper > Pokaż źródło , co powinno wyświetlić kod źródłowy strony internetowej.

• Jak wyświetlić kod źródłowy witryny w przeglądarce Chrome na urządzeniu z Androidem?

  Przejdź do witryny, którą chcesz wyświetlić, korzystając z aplikacji Chrome na swoim urządzeniu, a następnie wybierz pasek adresu przeglądarki. Przesuń kursor tekstowy maksymalnie w lewo — przed adresem URL — i wpisz Pokaż źródło , następnie naciśnij Wchodzić lub wybierz Iść .

  jak zrobić kolaż na iPhonie