Domovská » jak » Jak používat webové vývojářské nástroje aplikace Firefox pro zobrazení webových struktur ve 3D

    Jak používat webové vývojářské nástroje aplikace Firefox pro zobrazení webových struktur ve 3D

    Firefox 11 přidal dva nové nástroje pro vývojáře do již působivého arzenálu Firefoxu. Funkce Tilt zobrazuje struktury webových stránek ve 3D, zatímco Editor stylů může upravovat styly stylů CSS za běhu.

    3D funkce, známá jako Tilt, je způsob vizualizace DOM webových stránek. Integruje se s existujícím inspektorem dokumentů a používá WebGL k zobrazení bohaté 3D grafiky ve vašem prohlížeči.

    Tilt - 3D vizualizace webových stránek

    Ke zpřístupnění Tilt můžete přistupovat z inspektora stránky aplikace Firefox. Chcete-li začít, otevřete stránku Inspector výběrem položky "Inspect" v nabídce Web Developer. Můžete také kliknout pravým tlačítkem myši na aktuální stránku a zvolit "Inspect Element" a spustit inspektor na určitém prvku.

    Klikněte na tlačítko "3D" na panelu nástrojů inspektoru.

    Struktura stránky se zobrazí po aktivaci režimu 3D, ale bude vypadat rovnoměrně, dokud ji neotočíte.

    Otočte model kliknutím levým tlačítkem myši, přetáhněte obraz kliknutím pravým tlačítkem myši a přiblížením a oddáním pomocí kolečka myši.

    Tento pohled je integrován s ostatními nástroji v inspektoru. Pokud máte otevřené panely HTML nebo Styl, můžete klepnutím na prvek na stránce hte zobrazit HTML kód nebo vlastnosti CSS daného prvku.

    Další funkce 3D

    Funkce 3D vizualizace byla založena na rozšíření Tilt, ale nemá všechny funkce rozšíření Tilt. pokud chcete přizpůsobit barvy nebo dokonce exportovat vizualizaci jako 3D modelový soubor pro použití s ​​3D editačním programem, budete muset nainstalovat doplněk Tilt 3D. Až budete mít, získáte novou volbu "Tilt" v nabídce Web Developer.

    Klepnutím na tlačítko Zrušit použijete starou verzi nástroje Tilt po výzvě.

    Najdete zde ovládací prvky pro přizpůsobení vizualizace na levé straně okna a další možnosti včetně funkce exportu v horní části stránky.

    Editor stylu CSS

    Chcete-li zobrazit a upravit listy stylů stránky CSS, otevřete Editor stylů z nabídky Web Developer.

    Editor stylů uvádí seznam stylů na aktuální stránce. Přepnutím stylu listu zapněte nebo vypněte klepnutím na ikonu oka nalevo od názvu stylu. Upravte styl stylu tak, že jej vyberete a upravíte kód.

    Změny se okamžitě zobrazují na stránce. Pokud přepnete styl stylu, stránka ztratí informace o stylu. Pokud upravujete styl stylu, zobrazí se při zadávání úprav na stránce.

    K počítači můžete uložit kopii jednoho ze stylů, importovat stávající stylový štítek z počítače nebo přidávat nové prázdné styly s odkazy Uložit, importovat nebo nové v okně editoru stylů.


    Funkce 3D vizualizace sleduje změny na aktuální stránce a upozorňuje na změny. Když používáte Editor stylů s otevřeným inspektorem 3D, změny se okamžitě promítnou do zobrazení 3D. To také funguje s rozšířeními třetích stran, které upravují webové stránky, například Firebug.