Hur man Sätt en bild i Dreamweaver CS5

May 18

Hur man Sätt en bild i Dreamweaver CS5


Kartläggning en bild i Adobe Dreamweaver, en populär webbsida designprogram består av att skapa hotspots, eller länkar, på bilden som användare klickar för att navigera en webbplats. Bilder mappade på detta sätt kallas "bildkartor." Du kan skapa ett bild från någon grafisk eller fotografi du importerar till en HTML-sida med Dreamweaver image kartläggning verktyg.

Instruktioner

1 Öppna HTML-filen som du vill skapa ett bildschema i Dreamweaver, eller starta en ny sida genom att klicka på menyn "Arkiv", och sedan välja "Ny". Detta öppnar dialogrutan Nytt dokument. Välj "HTML" från kolumnen Typ, välja önskad sidlayout från kolumnen Layout och klicka sedan på "Skapa" -knappen.

2 Klicka på menyn "Arkiv" och välj "Spara som" för att öppna dialogrutan Spara som. Namnge och spara webbsidan filen.

3 Klicka på sidan där du vill skapa bilden kartan för att placera markören.

4 Klicka på "Infoga" -menyn och välj "Bild". Detta visar Välj bildkälla dialogrutan.

5 Navigera till den grafiska filen som du vill skapa ett bild, markera den och klicka sedan på "OK" -knappen. Dreamweaver bäddar bilden till din webbsida.

6 Gå till panelen Egenskaper och välj "rektangel Hotspot Tool." Du kan använda denna eller någon av de andra - Circle hotspot eller Polygon Hotspot - verktyg, beroende på den form du vill göra dina hotspots. Till exempel, om den bild du är kartläggning innehåller cirkulära former som du vill använda som knappar, välj "Circle Hotspot Tool."

7 Håll musknappen och dra markören runt området på bilden som du vill göra klickbar. När du släpper knappen, visar Dreamweaver ett grönt skuggat område där du ritade. Detta är den första hotspot i bilden karta.

8 Klicka på "Länk" -fältet i panelen Egenskaper och skriv in URL för denna hotspot.

9 Upprepa steg 6 till 8 för varje hotspot du vill skapa.

Tips

  • När du laddar upp din webbsida till webbservern, glöm inte att ladda upp bildfilen. Annars kommer bilden kartan inte visas och fungerar.

        

Välkommen till dig för att skicka en kommentar:

            
            
            
            

© 2023 Astrixsoft.com | Contact us: webmaster# astrixsoft.com