Co je dobré vědět
-
V Safari: Klikněte pravým tlačítkem na webovou stránku a vyberte Inspect Element.
- V Chrome můžete kliknout pravým tlačítkem a kliknout na Inspect.
- Aktivace funkce v Safari: Safari > Preferences > Advanced > Zobrazit nabídku Develop v liště nabídek box.
Tento článek vás naučí, jak zkontrolovat prvek webu na Macu. Zjistí, jak to udělat přes Safari a Google Chrome.
Jak používáte funkci Inspect Element na Macu?
Před kontrolou prvků na Macu při používání Safari musíte v prohlížeči povolit vývojářskou nabídku. Zde je pohled na to, jak jej zapnout a co udělat pro kontrolu prvku.
Pokud vidíte možnost Vyvíjet mezi záložkami a oknem, nabídka pro vývojáře již byla povolena a můžete přejít na krok 4.
Používání funkce Inspect Element v Safari
Zde je návod, jak používat Inspect Element v Safari, výchozím prohlížeči na počítačích Mac.
-
V Safari klikněte na Safari > Předvolby.
Image -
Klikněte na Pokročilé.
Image -
Klikněte na Zobrazit nabídku Vývoj na liště nabídek a poté okno zavřete.
Image - Při procházení webu klikněte pravým tlačítkem na položku, kterou chcete zkontrolovat.
-
Klikněte na Zkontrolovat prvek.
Image -
Nyní můžete zobrazit kód za webem, který jste zkontrolovali.
Image
Používání funkce Inspect Element v Chromu na Macu
Pokud na svém Macu místo Safari používáte Chrome, je zobrazení prvku ještě snazší, protože tuto funkci není potřeba aktivovat. Zde je to, co dělat.
- V Chrome přejděte na web.
- Klikněte pravým tlačítkem na prvek, který chcete zkontrolovat.
-
Klikněte na Inspect.
Image -
Kód nyní můžete zobrazit v postranním okně Chromu.
Image
Proč nemohu zkontrolovat na svém Macu?
Pokud jste v Safari nepovolili nabídku pro vývojáře, možná nebudete moci zkontrolovat prvek na vašem Macu. Zde je připomenutí, jak to udělat.
-
V Safari klikněte na Safari > Předvolby.
Image -
Klikněte na Pokročilé.
Image -
Klikněte na Zobrazit nabídku Vývoj na liště nabídek a poté okno zavřete.
Image
Jak provádět změny na webu kontrolou prvku
Kromě toho, že vám umožňuje zobrazit kód na webu, je také možné dočasně změnit jakýkoli prvek webu pomocí funkce Inspect Element. Zde je návod, jak to udělat přes Safari.
Postup je velmi podobný v jiných prohlížečích.
- Při procházení webu klikněte pravým tlačítkem na položku, kterou chcete zkontrolovat.
- Klikněte na Zkontrolovat prvek.
- Dvakrát klikněte na text v kódu, aby jej bylo možné upravit.
- Smažte jej nebo zadejte nový řetězec textu.
- Klepněte na Enter.
- Kód byl nyní dočasně změněn jen ve váš prospěch.
Proč byste chtěli používat funkci Kontrola prvku?
Možnost kontrolovat prvek je užitečná z mnoha důvodů.
- Pro změnu kódu za běhu. Návrháři webových stránek mohou dočasně změnit věci na webu, aby viděli, jak změny ovlivňují věci.
- Pro kontrolu kódu. Návrháři i marketingoví pracovníci mohou zkontrolovat kód, aby se ujistili, že tam jsou věci, jako jsou podrobnosti Google Analytics.
- Prohlížení obrázků odděleně od webu. Pokud vám web neumožňuje otevřít obrázek na nové kartě nebo okně, zobrazení prvku to umožňuje.
-
Tinker. Zobrazení kódu webové stránky vám může pomoci pochopit, co vidíte, a odstranit záhadu toho, co a proč se děje s webem, na kterém se nacházíte. Je to jako rozebírat spotřebič, abyste viděli, jak funguje, ale v tomto případě není možné ztratit žádné šrouby.
FAQ
Je legální kontrolovat web?
Ano. Pokud však plánujete použít jakýkoli kód nebo aktiva z webových stránek, ujistěte se, že se poraďte s vlastníkem a přidejte poznámku o autorských právech.
Jak zkopíruji HTML z webu s prvkem inspect?
V Chrome klikněte pravým tlačítkem na stránku a vyberte Inspect, poté přejděte do horní části a klikněte pravým tlačítkem na značku (např.). Vyberte Kopírovat > Kopírovat vnějšíHTML a vložte kód do textového nebo HTML souboru.
Mohu zkopírovat CSS z webu s prvkem inspect?
Ano. Klikněte pravým tlačítkem na prvek, který chcete zkopírovat, a vyberte Inspect. Klikněte pravým tlačítkem na zvýrazněný kód a vyberte Kopírovat > Kopírovat styly.
Jak zobrazím svá uložená hesla pomocí prvku inspect?
Chcete-li odhalit skrytá hesla, klikněte pravým tlačítkem na textové pole hesla a vyberte Inspect. Ve zvýrazněné části vyhledejte type=”password” a nahraďte password textem text. Existují jednodušší způsoby, jak zobrazit všechna svá hesla v Chromu.
