Hlavní Chrome Jak zobrazit zdrojový kód HTML v prohlížeči Google Chrome

Jak zobrazit zdrojový kód HTML v prohlížeči Google Chrome



Co vědět

  • Klikněte pravým tlačítkem na webovou stránku a vyberte Zobrazit zdroj stránky .
  • Zkratka: Stiskněte Ctrl + V (Windows PC) popř Příkaz + Volba + V (Mac).
  • Chcete-li použít vývojářské nástroje Chrome, vyberte Jídelní lístek (tři tečky) > Více nástrojů > Vývojářské nástroje .

Tento článek vysvětluje, jak získat přístup ke zdrojovému kódu HTML webových stránek ve webovém prohlížeči Google Chrome a jak získat přístup k vývojářským nástrojům Chrome a jak je používat. Zobrazení zdrojového kódu webu je pro začátečníky skvělý způsob, jak se naučit HTML.

Zobrazení zdrojového kódu v prohlížeči Chrome

Jak tedy vidíte zdrojový kód webu? Zde jsou podrobné pokyny, jak to provést pomocí prohlížeče Google Chrome.

  1. Otevři Webový prohlížeč Google Chrome (pokud nemáte Google Chrome nainstalován , jedná se o bezplatné stažení).

  2. Přejděte na webovou stránku, kterou chcete prozkoumat .

  3. Klikněte pravým tlačítkem myši strana a podívejte se na nabídku, která se objeví. V této nabídce klikněte na Zobrazit zdroj stránky .

    Zobrazit zdrojový kód stránky v kontextové nabídce webového prohlížeče Chrome
  4. Zdrojový kód této stránky se nyní zobrazí jako nová karta v prohlížeči.

  5. Případně můžete také použít klávesové zkratky Ctrl + V na PC a otevřete okno se zobrazeným zdrojovým kódem webu. Na Macu je tato zkratka Příkaz + Volba + V .

Hilary Allison / Lifewire

můžete zveřejňovat odkazy v komentářích na instagramu

Použijte nástroje pro vývojáře Chrome

Kromě jednoduchéhoZobrazit zdroj stránkyschopnost, kterou Google Chrome nabízí, můžete také využít jejich vynikající Vývojářské nástroje ponořit se ještě hlouběji do lokality. Tyto nástroje vám umožní nejen vidět HTML, ale také CSS, které platí pro zobrazení prvků v tomto HTML dokumentu.

Chcete-li použít vývojářské nástroje Chrome:

  1. OTEVŘENO Google Chrome .

  2. Navigovat do webovou stránku, kterou chcete prozkoumat .

  3. Vybrat třítečkové menu v pravém horním rohu okna prohlížeče.

  4. Z nabídky umístěte ukazatel myši Více nástrojů a pak si vyberte Vývojářské nástroje v nabídce, která se zobrazí.

    Položka nabídky Nástroje pro vývojáře v prohlížeči Google Chrome
  5. Otevře se okno, které zobrazuje zdrojový kód HTML na levé straně panelu a související CSS na pravé straně.

  6. Případně pokud kliknete pravým tlačítkem prvek na webové stránce a vyberte Kontrolovat z nabídky, která se zobrazí, vyskočí vývojářské nástroje Chrome a zvýrazní konkrétní část, kterou jste v HTML vybrali, pomocí odpovídajícího CSS zobrazeného vpravo. Je to velmi užitečné, pokud se chcete dozvědět více o konkrétní části webu.

    jak přidat hudbu do snapchat příběhu
Jak zkontrolovat prvek na Macu

Je prohlížení zdrojového kódu legální?

V průběhu let jsme měli mnoho nových webdesignérů, kteří se ptali, zda je přijatelné prohlížet si zdrojový kód webu a používat jej pro své vzdělávání a nakonec pro práci, kterou dělají. I když kopírování kódu webu ve velkém a vydávání jej za svůj vlastní na webu je jistě nepřijatelné, použití tohoto kódu jako odrazového můstku k učení se ve skutečnosti znamená, kolik pokroků bylo v tomto odvětví učiněno.

Jak jsme zmínili na začátku tohoto článku, dnes byste jen těžko hledali fungujícího webového profesionála, který se nic nenaučil prohlížením zdroje webu! Ano, zobrazení zdrojového kódu webu je legální. Použití tohoto kódu jako zdroje k vytvoření něčeho podobného je také bezpečné. Když začnete narážet na problémy, vezmete kód tak, jak je a vydáváte jej za svou práci.

Nakonec se weboví profesionálové učí jeden od druhého a často vylepšují práci, kterou vidí a kterou se inspirují, takže si neváhejte prohlédnout zdrojový kód webu a použít jej jako výukový nástroj.

jak odpálit lepkavé bomby v gta 5

Více než jen HTML

Jedna věc, kterou je třeba si zapamatovat, je, že zdrojové soubory mohou být velmi komplikované (a čím složitější je web, který si prohlížíte, tím složitější bude pravděpodobně i kód tohoto webu). Kromě struktury HTML, ze které se stránka skládá, budou existovat také CSS (kaskádové styly), které určují vizuální vzhled webu. Kromě toho bude dnes mnoho webových stránek obsahovat soubory skriptů spolu s HTML.

Pravděpodobně bude zahrnuto více souborů skriptů; ve skutečnosti každý z nich pohání jiné aspekty webu. Upřímně řečeno, zdrojový kód webu se může zdát ohromující, zvláště pokud s tím teprve začínáte. Nebuďte frustrovaní, pokud nemůžete okamžitě zjistit, co se s tím webem děje. Zobrazení zdroje HTML je pouze prvním krokem v tomto procesu. S trochou zkušeností začnete lépe chápat, jak všechny tyto části do sebe zapadají, aby vytvořily web, který vidíte ve svém prohlížeči. Až se s kódem blíže seznámíte, budete se z něj moci dozvědět více a nebude se vám zdát tak skličující.

FAQ
  • Jak upravím HTML kód v Chrome?

    Stisknutím otevřete Nástroje pro vývojáře v Chromu Ctrl (nebo Příkaz na Macu) + Shift + I . Odtud stiskněte Ctrl ( Příkaz na Macu) + O a výběrem uloženého zdrojového souboru, který chcete upravit, jej otevřete.

  • Jak zobrazím zdrojový kód stránky v prohlížeči Chrome, pokud je zakázáno zobrazení zdroje?

    Pokud webová stránka zakázala možnost Zobrazit zdroj, možná budete moci nahlédnout pod pokličku. V horní části okna prohlížeče vyberte Pohled > Vývojář > Zobrazit zdroj , který by měl stáhnout zdrojový kód webové stránky.

  • Jak zobrazím zdrojový kód webu v prohlížeči Chrome pomocí zařízení Android?

    Přejděte na web, který chcete zobrazit, pomocí aplikace Chrome v zařízení a poté vyberte adresní řádek prohlížeče. Přesuňte textový kurzor zcela vlevo – před adresu URL – a zadejte zobrazit-zdroj a poté stiskněte Vstupte nebo vyberte Jít .

Zajímavé Články

Redakce Choice

Jak zjistit, zda web nefunguje všem nebo jen vám
Jak zjistit, zda web nefunguje všem nebo jen vám
Proč se nemohu dostat na tento web? Nepanikařte! Vyzkoušejte tyto tipy a zjistěte, zda je problém s vámi nebo s webem.
Jak přepnout na jednoduché HTML zobrazení Gmailu Basic
Jak přepnout na jednoduché HTML zobrazení Gmailu Basic
Gmail nabízí jednoduché a základní HTML rozhraní pro rychlý a funkční e-mail v jakémkoli prohlížeči.
Jak zapnout svítilnu na telefonu Android
Jak zapnout svítilnu na telefonu Android
Svítilnu na svém telefonu Android můžete zapnout příkazem „Hej Google, zapni baterku“ prostřednictvím nabídky Rychlý přístup a některé telefony mají ovládání gesty.
Jak přesunout složku Dropbox
Jak přesunout složku Dropbox
Když si nainstalujete desktopovou aplikaci Dropbox, získáte přístup ke složce Dropbox přímo z operačního systému. Mít ho je výhodné z mnoha důvodů – může se například ukázat jako neocenitelné, když náhle ztratíte internet
32 nejlepších bezplatných softwarových nástrojů pro zálohování
32 nejlepších bezplatných softwarových nástrojů pro zálohování
Recenze nejlepších bezplatných programů pro zálohování. Použijte jeden k automatickému vytváření kopií souborů pro úschovu.
Vytvořte zástupce historie spolehlivosti ve Windows 10
Vytvořte zástupce historie spolehlivosti ve Windows 10
Jak vytvořit zástupce historie spolehlivosti ve Windows 10 - podívejte se, jak vytvořit zástupce historie spolehlivosti a otevřít jej jedním kliknutím.
10 problémů se systémem Windows 10 a jejich řešení
10 problémů se systémem Windows 10 a jejich řešení
Aktualizace dubnové aktualizace Windows 10 přišla s problémy - natolik, že Microsoft původně stáhl verzi z 10. října kvůli strašným chybám. Byla to skutečná škoda, protože Windows 10 pravděpodobně je