Sådan laver du rollover billeder med HTML-kode

Indhold

retninger
Hvad du har brug for

Med de millioner af hjemmesider, der findes på internettet, er det vigtigt, at din er unik. En teknik, der bruges til at tilføre en dynamisk effekt til websteder, er "rollover images", også kendt som "rollover-knapper". I det væsentlige, når den besøgende svæver over et billede, ændres det og vender tilbage til det normale, når musen fjernes. Dette kan bruges til nogle subtile effekter, som f.eks. Ændring af farve på billedet eller brevet. Du kan oprette dit eget rollover-billede med grundlæggende HTML-formatering i forskellige designprogrammer.

retninger

Opret dynamiske websites ved hjælp af rollover billeder (Jupiterimages / Photos.com / Getty Images)

Opret et nyt dokument med den ønskede størrelse (i pixels) ved hjælp af billedredigeringssoftware som Photoshop. Opret de normale og "rollover" billeder, som skal have samme størrelse.
Gem begge billeder individuelt ved at gå til menuen "Fil" og vælge "Gem". Brug JPEG-, GIF- eller PNG-formater. Selvom de to første er de mest almindeligt anvendte, bevarer PNG'er gennemsigtighed. Sørg for at gemme billedet til den lokale rodmappe på dit websted.
Åbn den rigtige designsoftware, f.eks. Adobe Dreamweaver. Klik på knappen "Opdater" i biblioteket for at opdatere biblioteket og den lokale rodmappe til dit websted. Find billederne i rodmappen.
Skift til kodevisningen på websiden.
Type "
"I koden, uden start citater.
Udskift "http://yoursite.com" med din hjemmeside adresse. Udskift også "IMAGE1" og "IMAGE2" med navnene på de normale og "rollover" billederne.