Firefox 11 tilføjede to nye webudviklerværktøjer til Firefox's allerede imponerende arsenal . Tilt-funktionen visualiserer webstrukturer i 3D, mens Style Editor kan redigere CSS-stilark på farten.
3D-funktionen, kendt som Tilt, er en måde at visualisere et websteds DOM på. Det integreres med den eksisterende Document Inspector og bruger WebGL til at vise rig 3D-grafik i din browser.
Tilt - 3D webstedsvisualisering
Du kan få adgang til Tilt fra Firefox's Page Inspector. For at komme i gang skal du åbne sideinspektøren ved at vælge “Inspicer” i menuen Webudvikler. Du kan også højreklikke på den aktuelle side og vælge "Inspicer element" for at starte inspektøren ved et bestemt element.
Klik på “3D” -knappen på inspektørens værktøjslinje.
Du ser sidens struktur efter aktivering af 3D-tilstand, men den ser flad ud, indtil du roterer den.
Drej modellen ved at venstreklikke, flyt billedet rundt ved at højreklikke og zoome ind og ud ved hjælp af musen.
Denne opfattelse er integreret med de andre værktøjer i inspektøren. Hvis du har HTML- eller Style-panelerne åbne, kan du klikke på et element på hte-siden for at få vist elementets HTML-kode eller CSS-egenskaber.
Flere 3D-funktioner
3D-visualiseringsfunktionen var baseret på Tilt-udvidelsen, men den har ikke alle funktionerne i Tilt-udvidelsen. Hvis du vil tilpasse farverne eller endda eksportere visualiseringen som en 3D-modelfil til brug med et 3D-redigeringsprogram, skal du installere Vip 3D-tilføjelse . Når du har det, får du en ny "Tilt" -indstilling i menuen Webudvikler.
Klik på knappen Annuller for at bruge den gamle version af Tilt, når du bliver bedt om det.
Du finder kontrolelementer til at tilpasse visualiseringen til venstre i vinduet og andre muligheder, herunder eksportfunktionen, øverst på siden.
CSS Style Editor
For at få vist og redigere en sides CSS-stilark skal du åbne Style Editor fra menuen Webudvikler.
Style-editoren viser stilarkene på den aktuelle side. Slå et stilark til eller fra ved at klikke på øjeikonet til venstre for typografiarkets navn. Rediger et typografiark ved at vælge det og ændre koden.
Ændringer reflekteres straks på siden. Hvis du slår et stilark fra, mister siden sine stiloplysninger. Hvis du redigerer et typografiark, vises redigeringerne på siden, mens du skriver.
Du kan gemme en kopi af et af typografiarkene på din computer, importere et eksisterende typografiark fra din computer eller tilføje et nyt, tomt typografiark med linkene Gem, Import eller Ny i vinduet Style Editor.
3D-visualiseringsfunktionen holder øje med ændringer på den aktuelle side og bemærker, når der sker ændringer. Når du bruger Style Editor med 3D-inspektøren åben, reflekteres dine ændringer med det samme i 3D-visningen. Dette fungerer også med tredjepartsudvidelser, der ændrer websider, såsom Firebug.
