Så här lägger du in bilder i HTML

Att lägga till bilder på din webbplats eller profil i ett socialt nätverk är ett utmärkt sätt att förgöra det. HTML (HyperText Markup Language) har många webbutvecklingsmöjligheter, men koden som behövs för att lägga till bilder är relativt enkel.

Infoga bilder i HTML

Bildnamn Lägg till bilder med HTML-steg 1

Ladda upp din bild till en webbplats som erbjuder en bildhanteringstjänst, till exempel Photobucket eller TinyPic, och som låter dig använda snabbkoppling. Hot-linking hänvisar till en direktlänk till bilden från webbplatsservern - vissa webbplatser tillåter inte det eftersom det utnyttjar sin bandbredd och tar upp plats på sina servrar.

Om du har en betald webbtjänst är det bättre att använda den som laddar upp bilden. Det är mer tillförlitligt än gratis webbplatser.

Öppna ett nytt dokument i en textredigerare (ex. Notepad), eller direkt på webbplatsen / profilen där du kan redigera HTML.

Bildnamn Lägg till bilder med HTML-steg 3

Börja med taggen img. Taggen img Det är tomt, vilket betyder att det inte finns något behov av att stänga det. Men för att den också ska vara giltig i XHTML, kan du lägga till ett mellanslag och ett snedstreck före stora tecknet.

Det finns många attribut som kan läggas till, men endast en är absolut nödvändigt: src. Detta indikerar adressen eller webbadressen till din bild.

Nu ska du lägga till attributet stopp. Detta anger alternativtexten om bilden inte laddas. Dessutom läses detta av automatiska läsare på blinda datorer.

Genom att peka på markören på bilden visas alternativtexten, men endast i Internet Explorer. En lösning som fungerar på alla webbläsare (Firefox är bra et al.) är att använda attributet titel samt stopp. (Om du inte bryr dig om att meddelandet visas på bilden, glöm det här steget.)

exempel:

1
Dessutom finns det också möjlighet att ange bildstorleken med attributen höjd och bredd (höjd och bredd) och specificerar i antal pixlar eller i procent. Tänk på att ändringen av detta värde bara ändrar hur bilden visas. Webbläsaren laddar fortfarande den faktiska storleken på bilden, så om du har en för stor ska du hellre ändra den med ett bildredigeringsprogram, eller PicResize.com.

tips

Värdet av dessa attribut är ett positivt tal som anger pixlar eller ett procentvärde på 1 till 100.
Bilden eller bilden kan placeras i någon del av webbsidan med attributet "rikta", placera den på toppen (övre), botten (botten), mitten (mitten), höger (höger), vänster (vänster), etc.
Värdet "hspace" den används för att infoga mellanslag till höger och till vänster om bilden, medan attributet "vspace" sätter in utrymme ovanför och under bilden för att skilja det från de andra elementen på sidan.
Överdriv inte bilderna. Det kommer bara att se ut som en oorganiserad och amatörsida.
För logotyper eller animationer är GIF-bilder bra, medan JPEG-filer är bättre för mer komplexa bilder, t.ex. fotografier.
GIF-bilder stödjer bara 8-bitars färg för upp till 256 färger. Därför är förlusten av detaljer oundviklig om du använder det här formatet för bilder som är rika på färger som foton.
GIF-bilder stödjer öppenhet. En enda färg kan ställas in som transparent.
Interlacing stöds också av GIF-bilder och det gör det möjligt att förhandsgranska bilden innan den är fullt laddad.
GIF-formatet stöder också animering.

varningar

Gör inte hot-linking om det inte är tillåtet!

Dela på sociala nätverk:

Relaterade