Ollies HTML-skola för nybörjare.
Hur vi gör en enkel websida.
Lektion 2Länkar och tabellerHar du kommit så här långt har du en sida som innehåller lite text och bilder. Nu ska vi jobba med att göra den ännu snyggare och få den att kommunicera med en annan sida. För att kunna göra det så behöver du en sida till.Klicka här för att gå tillbaka till första lektionen och gör en ny websida, som du döper till annat än index.html eller default.html. Glöm inte bort att avsluta filnamnet med .html, och använd inte bokstäverna Å, Ä och Ö.Din första sida fick färg som bakgrund, men på den ska vi lägga lägga en bild som bakgrund. Som du kanske kommer ihåg, så las bakgrundskommandot in i BODY-taggen och på din index sida ser den så här; (Här har jag valt en svart bakgrund med silverfärgad text)<BODY BGCOLOR="#000000" TEXT="#c0c0c0">. I mappen bilder hittar du några lämpliga bakgrunder eller du kan göra några egna i Photoshop. För att kunna ange en bild som bakgrund så måste du ändra i BODY-taggen till <BODY BACKGROUND="bilder\filnamn för bilden.bildformat" text="#c0c0c0">. På den här sidan, har jag använt bakgrunden "nebula.jpg" och då ser taggen ut så här; <BODY BACKGROUND="bilder\nebula.jpg" text="#c0c0c0">. Man kan även ha en bakgrund som är fixerad, medan texten är rullbar och då lägger man till delkommandot bgproperties="fixed" sist i BODY-taggen så här <BODY BACKGROUND="bilder\nebula.jpg" text="#c0c0c0"> bgproperties="fixed">. Här kan du länken tillbaka med rullande bakgrund. Länkar.Länkar är det bästa och det bekvämaste sättet för en websida kommunicera med andra sidor. Och i praktiken den enda för ingen kan ju komma ihåg alla adresser till intressanta websidor, eller hur. Om du placerar länkar till din websida, kan du enkelt och bekvämt navigera dig till dessa. När du har din sida ute på nätet, besök gärna de sidor du har länkat till för att kontrollera att de fungerar. Det händer ju att privatpersoner, företag, organisationer och föreningar ändrar sina addresser och då måste du, om du vill behålla länken ändra addressen eller URL som den kallas för. Allt detta gör att din sida förblir fräsh och besökarvänligt. En länk består av tre delar, själva kommandot med address en synlig del och ett avslut på länken. <a href="URL">Synlig text eller bild </a>. Om vi säger att den sidan som du gjorde nyss ska länkas till din index-sida, så ska länken se ut så här om du har gjort det rätt; <a href="index.html">>Till första sidan</a>. Om du vill länka låt oss säga till Altavista.com eller en annan websida måste du skriva hela addressen <a href="http://altavista.com/">Till Altavista </a>. Du får automatisk en lila färg till länken, men om du har en lila eller blåtonig bakgrund eller vill bara en annan färg till länkar för att du kanske tycker det ser snyggare ut så får du ange detta i body-taggen. Här visar jag olika varianter med de tidigare exempel: Med bakgrundsfärg:<BODY BGCOLOR="#000000" link="#ff0000" alink="#0000ff" vlink="#ffa400"> Med bakgrundsbild:<BODY BACKGROUND="bilder\nebula.jpg" text="#c0c0c0" link="#ff0000" alink="#0000ff" vlink="#ffa400"> Med bakgrundsbild med fixerad bakgrund:<BODY BACKGROUND="bilder\nebula.jpg" text="#c0c0c0" link="#ff0000" alink="#0000ff" vlink="#ffa400" bgproperties="fixed"> Nu blev det en massa nya del kommandon eller hur, lugn bara lugn vi tar dem här.... linkSjälva färgen på länken när du kommer till sidan.alinkFärg på länken när du klickar på den.vlinkVisar att du har besökt den länkade sidan tidigare.Du kan också använda en bild för en länk is tället för en text. Här visar jag länken med älgen från första lektionen. Klicka gärna på den!  koden ser ut så här; <a href="twilight.html">
<img src="bilder3/anielg.gif"></a>Ibland kan det se snyggare om man har länken utan ram, då lägger man till delkommandot border=0 in i img src-taggen. Se den modifierade varianten under. koden ser ut så här; <a href="twilight.html">
<img src="bilder3/anielg.gif" border=0></a> |
Slut på Lektion 2
Till lektion 3
Webdesign:Ollie Ahokas, e-mail:Olliehokas@.yahoo.se