Dokumentverktygsfältet i Adobe CS5 Dreamweaver

Dokumentverktygsfältet i Adobe Creative Suite 5 (Adobe CS5) Dreamweaver innehåller verktyg som hjälper dig att visa ditt dokument i olika lägen, som kod och design, samt adressera objekt som dokumenttitel och webbläsarkompatibilitet.

• Kodvy: Visa koden och endast koden med denna vy. Dreamweaver hjälper dig att dechiffrera kod genom att färgkoda taggar, attribut, CSS och andra element.

• Dela vy: Om du väljer detta alternativ delas dokumentfönstret mellan kod- och designvyer. Denna vy kan vara oerhört användbar eftersom du ser både designen och koden samtidigt.

  

  Styr din vy av sidan från dokumentverktygsfältet.

• Designvy: Detta alternativ visar din sida i designvy i dokumentfönstret.

• Live-kod: När Live View är aktiverat kan du visa källkoden för ditt dokument som en användare skulle se den i en webbläsare men du kan inte redigera sidkoden i den här vyn.

• Kontrollera webbläsarkompatibilitet: Den här menyn visar alternativ som låter dig kontrollera sidans integritet, till exempel tillgänglighet, eller om dina CSS-regler är kompatibla mellan olika webbläsare.

• Live View: Live View renderar din sida som om den är i en webbläsare, fri från ramar, guider och andra visuella hjälpmedel. I Live View kan du inte redigera det förhandsgranskade innehållet, men du kan hoppa till kod-, delad- eller designvy och ändra ditt sidinnehåll.

• Inspektera: Den nya Inspektera-knappen fungerar med Live View för att avslöja CSS-reglerna som formaterar element på din sida. När du väljer ett element på sidan med Inspektera aktiverat avslöjar panelen CSS Styles egenskaperna som formaterar det elementet och låter dig inaktivera eller ändra specifika egenskaper och se resultaten.

• Förhandsgranska/felsöka i webbläsare: Klicka på den här knappen för att förhandsgranska eller felsöka ditt dokument i en av dina installerade webbläsare, Adobes BrowserLab eller Device Central.

• Visuella hjälpmedel: Klicka på den här knappen för att välja olika visuella hjälpmedel (som ramar och guider) som hjälper dig att se olika element och göra det enklare att designa dina sidor.

• Uppdatera designvy: Klicka på den här knappen för att uppdatera dokumentets designvy efter att du har gjort ändringar i kodvyn. Ändringar du gör i kodvyn visas inte automatiskt i designvyn förrän du utför vissa åtgärder, som att spara filen eller klicka på den här knappen.

• Dokumenttitel: Ange namnet på ditt dokument i det här fältet.

• Filhantering: Klicka på den här knappen för att visa popupmenyn Filhantering. Använd den här menyn för att checka in eller ut ditt dokument när det är aktiverat för din webbplats.

• Föregående sida/Nästa sida/Uppdatera/Adressfält: I Live View fungerar dessa verktyg precis som de skulle göra i en webbläsare och gör att du kan navigera mellan sidor, uppdatera sidan och se adressen till den aktuella sidan. Adressfältet fungerar också när Live View inte är aktiverat, vilket avslöjar sökvägen till dokumentet du för närvarande arbetar med.

• Relaterade dokument: Dokument som används av och bifogas din sida, såsom externa CSS- och JavaScript-filer, listas nedan (Mac) eller ovanför (Windows) vyvalsknapparna (Kod/Dela/Design). Du kan klicka på vilket dokument som helst för att redigera den bifogade filen i delad vy utan att behöva byta dokument.

  • XML, JavaScript, CSS och andra kodbaserade filtyper kan endast visas och redigeras i kodvyn; Design- och Split-knapparna är nedtonade.

  • Uppdatering uppdaterar också kodfunktioner som är beroende av Document Object Model (DOM), till exempel möjligheten att välja ett kodblocks öppnings- eller stängningstaggar.

• Live View-alternativ: Klicka och välj alternativ från den här menyn för att styra hur ditt dokument visas och fungerar när Live View är aktiverat.