Läs det här avsnittet om du vill lära dig hur du använder egenskapsinspektören för att redigera kod i designvyn i Adobe Dreamweaver.
Dreamweaver låter dig visuellt skapa och redigera webbsidor utan att behöva oroa dig för den underliggande källkoden, men det finns tillfällen då du kanske behöver redigera koden för större kontroll eller för att felsöka din webbsida. Dreamweaver låter dig redigera viss kod medan du arbetar i designvyn.
Det här avsnittet är utformat för personer som föredrar att arbeta i designvyn, men som också vill ha snabb åtkomst till koden.
Markera underordnade taggar i designvyn
Om du väljer ett objekt i designvyn som innehåller underordnade taggar—till exempel en HTML-tabell—kan du snabbt välja den första underordnade taggen för det objektet genom att välja Redigera > Välj underordnad.
Det här kommandot är endast tillgängligt i designvyn.
Till exempel har <table>-taggen normalt <tr> underordnade taggar. Om du väljer en <table>-tagg i taggväljaren kan du välja den första raden i tabellen genom att välja Redigera > Välj underordnad. Dreamweaver väljer den första <tr>-taggen i taggväljaren. Eftersom <tr>-taggen själv har underordnade taggar, nämligen <td>-taggar, väljer Dreamweaver den första cellen i tabellen när du väljer Redigera > Välj underordnad igen.
Redigera kod med egenskapskontrollen
Du kan använda egenskapsinspektören för att inspektera och redigera attributen för text eller objekt på din sida. Egenskaperna som visas i egenskapsinspektören motsvarar i allmänhet attribut för taggar; att ändra en egenskap i egenskapsinspektören har i allmänhet samma effekt som att ändra motsvarande attribut i kodvyn.
Både tagginspektören och egenskapsinspektören låter dig visa och redigera en taggs attribut. Tagginspektören låter dig visa och redigera vartenda attribut som är kopplat till en given tagg. Egenskapsinspektören visar endast de vanligaste attributen, men ger en rikare uppsättning kontroller för att ändra dessa attributs värden, och låter dig redigera vissa objekt (som tabellkolumner) som inte motsvarar specifika taggar.
Egenskapsinspektören för texten eller objektet visas under dokumentfönstret. Om egenskapsinspektören inte är synlig väljer du Fönster > Egenskaper.
Redigera CFML med egenskapskontrollen
Använd egenskapsinspektören för att inspektera och ändra ColdFusion-kod i designvyn.
Knappen Innehåll visas endast om den valda taggen inte är en tom tagg (det vill säga om den har både en öppnings- och en stängningstagg).
Quick Tag Editor – översikt
Du använder snabbtaggredigeraren för att snabbt inspektera, infoga och redigera HTML-taggar utan att lämna designvyn.
Om du skriver ogiltig HTML i snabbtaggredigeraren försöker Dreamweaver korrigera den åt dig genom att infoga avslutande citattecken och avslutande vinkelparenteser där det behövs.
För att ställa in alternativen för snabbtaggredigeraren öppnar du snabbtaggredigeraren genom att trycka på Ctrl+T (Windows) eller Cmd+T (Macintosh).
Quick Tag Editor har tre lägen:
- Läget Infoga HTML används för att infoga ny HTML-kod.
- Läget Redigera tagg används för att ändra en befintlig tagg.
Läget Infoga HTML används för att infoga ny HTML-kod.
Läget Redigera tagg används för att ändra en befintlig tagg.
Läget Kapsla in tagg är till för att kapsla in den aktuella markeringen med en tagg.
Vilket läge Quick Tag Editor öppnar beror på den aktuella markeringen i designvyn.
I alla tre lägen är grundproceduren för att använda Quick Tag Editor densamma: öppna redigeraren, ange eller ändra taggar och attribut och stäng sedan redigeraren.
Du kan bläddra genom lägena genom att trycka på Ctrl + T (Windows) eller Kommando + T (Macintosh) när Quick Tag Editor är aktivt.
Redigera kod med snabbredigeraren
Använd snabbredigeraren (Redigera > Snabbredigerare) för att snabbt infoga och redigera HTML-taggar utan att lämna designvyn.
Infoga en HTML-tagg
Quick Tag Editor öppnas i läget Infoga HTML.
Taggen infogas i din kod, tillsammans med en matchande avslutande tagg om tillämpligt.
Redigera en HTML-tagg
Du kan också välja den tagg du vill redigera från taggväljaren längst ned i dokumentfönstret. Mer information finns i Redigera kod med taggväljaren.
Quick Tag Editor öppnas i läget Redigera tagg.
Som standard tillämpas ändringarna på dokumentet när du trycker på Tab eller Skift+Tab.
Omslut den aktuella markeringen med HTML-taggar
Om du markerar text eller ett objekt som innehåller en inledande eller avslutande HTML-tagg öppnas Ändra taggtext i läget Redigera tagg istället för i läget Kapsla in tagg.
Quick Tag Editor öppnas i läget Kapsla in tagg.
Taggen infogas i början av den aktuella markeringen och en matchande sluttagg infogas i slutet.
Använd tipsmenyn i Quick Tag-redigeraren
Snabbtaggredigeraren innehåller en attributtipsmeny som listar alla giltiga attribut för taggen du redigerar eller infogar.
Du kan också inaktivera hintmenyn eller justera fördröjningen innan menyn dyker upp i Quick Tag Editor.
För att se en hintmeny som listar giltiga attribut för en tagg pausar du kort medan du redigerar ett attributnamn i Quick Tag Editor. En hintmeny visas som listar alla giltiga attribut för taggen du redigerar.
På samma sätt kan du se en hintmeny som listar giltiga taggnamn genom att pausa kort medan du anger eller redigerar ett taggnamn i Quick Tag Editor.
Inställningarna för kodtips i Quick Tag Editor styrs av de vanliga inställningarna för kodtips.Mer information finns i Ange inställningar för kodningsförslag.
Börja skriva in ett tagg- eller attributnamn. Valet i menyn Kodningsförslag hoppar till det första objektet som börjar med bokstäverna du skrev.
Använd uppåt- och nedåtpilarna för att markera ett objekt.
Använd rullningslisten för att hitta ett objekt.
Inaktivera hintmenyn eller ändra fördröjningen innan den visas
Dialogrutan Inställningar för kodtips visas.
Redigera kod med taggväljaren
Du kan använda taggväljaren för att markera, redigera eller ta bort taggar utan att gå ur designvyn. Taggväljaren finns i statusfältet längst ned i dokumentfönstret och visar en rad taggar.
Redigera eller ta bort en tagg
Taggarna som gäller vid infogningspunkten visas i taggväljaren.
Välj ett objekt som motsvarar en tagg
Taggarna som gäller vid infogningspunkten visas i taggväljaren.
Objektet som taggen representerar markeras på sidan.
Använd den här tekniken för att välja enskilda tabellrader (tr-taggar) eller celler (td-taggar).
Skriv och redigera skript i designvyn
Du kan arbeta med JavaScript och VBScript på klientsidan i både kod- och designvy på följande sätt:
Skriv ett JavaScript- eller VBScript-skript för din sida utan att lämna designvyn.
Skapa en länk i ditt dokument till en extern skriptfil utan att lämna designvyn.
Redigera ett skript utan att lämna designvyn.
Innan du börjar väljer du Visa > Visuella hjälpmedel > Osynliga element för att säkerställa att skriptmarkörer visas på sidan.
Skriva ett klientskript
Välj Infoga > HTML > Skript.
Markera skriptet i filvalsfönstret.
Du behöver inte inkludera de inledande eller avslutande script-taggarna.
Script-taggen för den markerade filen infogas i dokumentet.
Redigera ett skript
Skriptet visas i dialogrutan Skriptegenskaper.
Om du länkade till en extern skriptfil öppnas filen i kodvy, där du kan göra dina redigeringar.
Om det finns kod mellan skripttaggarna öppnas dialogrutan Skriptegenskaper även om det också finns en länk till en extern skriptfil.
Klicka på mappikonen eller knappen Bläddra för att markera en fil eller skriv in sökvägen.
Redigera ASP-skript på serversidan i designvy
Använd egenskapsinspektören för ASP-skript för att granska och ändra ASP-skript på serversidan i designvy.
Redigera skript på sidan med egenskapsinspektören
Om du använder JavaScript och är osäker på versionen, välj JavaScript snarare än JavaScript1.1 eller JavaScript1.2.
(Valfritt) I rutan Källa anger du en externt länkad skriptfil. Klicka på mappikonen för att markera filen eller skriv in sökvägen.
Använd JavaScript-beteenden
Du kan enkelt koppla JavaScript-beteenden (på klientsidan) till sidelement genom att använda fliken Beteenden i Tagginspektorn.Mer information finns i Applying built‑in JavaScript behaviors Dreamweaver.
Skapa snygga webbplatser i Dreamweaver
Designa, koda och hantera dynamiska webbplatser med ett kraftfullt allt-i-ett-verktyg.