Foga in bild i hemsida med hjälp av html-kod.
Nu är det dags att göra en hemsida där du fogar in en bild.
Här finns bilder som du kan välja att jobba med. Spara bilderna i din arbetsmapp!
När det är gjort ska du tillverka en mall med de koder som behövs för att infoga en bild.
Ta fram "Anteckningar" och spara som... bildmall.html Spara filen i din hemsidemapp!
Nu kan du "kopiera" avsnittet med koderna som finns här nedan och "klistra in" i "Anteckningar" (bildmall.html):
<html>
Spara!
Bra att veta:
<br> betyder radbrytning.
<p> betyder nytt stycke.
Dessa två koder lägger vi inte in i någon mall eftersom man inte vet var man vill lägga in dem när man väl börjar skriva.
Försök att minnas dem.
Ta fram "bildmall.html". Högerklicka och "Visa källa". Markera allt och "Kopiera". Minimera fönstret.
Skriv in på lämpligt ställe:
Brödtext: Koltrasten...<br>
När...
Spara. Minimera. Kolla nu resultatet! Om det smög sig in ett fel får du ta fram sidan i "Anteckningar" igen och
rätta. Spara. Kolla igen!
Kommentar:
Om tiden räcker till gör du fler hemsidor där du lägger in en eller flera bilder och skriver text till.
Använd "bildmall.html". Hitta på egen "title", "rubrik", valfri bild och "brödtext".
Här ser du hur det kan se ut i färdigt skick:
<head>
<title> </title>
</head>
<body>
<h2>
</h2>
<img width="" height="" src="">
<font size="4">
</font>
</body>
</html>
Skrivskydda mallen!
Dessa båda koder har ingen avslutningskod vilket är bra eftersom man använder dem så ofta.
Nu är det dags att lägga in en bild på en hemsida.
<img width="" height="" src=""> är det nya du ska prova på den här gången.
Den här koden "talar om " för datorn att det gäller en bild. Men det finns inga värden inskrivna. Då kan den inte fungera.
Låt oss anta att du väljer att lägga in koltrasten på din hemsida.
Öppna din arbetsmapp och ta reda på dessa tre saker:
1) Vad heter bildfilen? Svar: koltrast.gif
2) Hur bred är den? Svar: 100 bildpunkter
3) Hur hög är den? Svar: 77 bildpunkter
Du får fram dessa svar genom att högerklicka på biden och se på "Egenskaper" (sammanfattning).
Ta fram ett nytt fönster i "Anteckningar" och "Klistra in". "Spara som..." koltrasten.html
Titel: Min hemsida med infogad bild.
Rubrik: Koltrasten
<img width="100" height="77" src="koltrast.gif">
Den... <p>
OBS! Det är bra att vara konsekvent. Använd alltid små bokstäver i filnamn! Kom ihåg att det inte får vara å, ä, ö eller
mellanslag i filnamnet.
De bilder som man använder på en hemsida får inte vara för stora räknat i kB. Då tar det lång tid att ladda ner dem i
datorn och risken är stor att besökaren tröttnar och går vidare till annan hemsida. Detta utesluter bilder sparade i
filformatet ".bmp". De kräver stort utrymme. Ett bra filformat är ".jpg". Ett annat bra format är ".gif". Om dessa bildfiler
är över 60-70 kB bör man fundera om det går att beskära bilden eller ändra storlek på den i något bildbehandlingsprogram.
De bilder man använder bör man försäkra sig om att man får använda. Bäst är att ha egna foton som man skannar in eller som
man för över via CD eller digitalkamera. Man kan också ta något som man själv ritat i "Paint".
Koltrasten kommer ibland för att få fågelmat. Den letar frön som småfåglarna spritt
omkring fröautomaterna.När den varma årstiden kommer är koltrastarna duktiga på att leta mask på gräsmattorna. Med ungar i boet går det åt mycket mat!