Lektion 3


Färger och horisontella streck

“Standardutseendet” på en hemsida är vit bakgrund, svart text, blå obesökta länkar och röda besökta länkar. Det kan du lätt ändra på. Ändra i dokumentet “lektion2.htm” så att det ser ut så här:

<HTML>
<HEAD>
<TITLE>Min hemsida</TITLE>
</HEAD>
<BODY BGCOLOR="#7DBDE3" TEXT="#000000"
LINK="#0000FF" VLINK="#333333" ALINK="#FFFF80">
<CENTER>
<H1>Välkommen till min hemsida!</H1>
</CENTER>
<HR WIDTH="100%" />
<P>
<FONT SIZE=4>
Det här är mitt första försök att göra en egen hemsida.
Ju mer jag lär mig, desto bättre kommer sidan att bli.
Ha lite tålamod så blir du rikligt belönad!
</FONT>
</P>
<HR WIDTH="100%" />
</BODY>
</HTML>

I koden <BODY> kan man lägga till flera parametrar som talar om hur sidan ska se ut. BGCOLOR (background color) anger vilken bakgrundsfärg sidan ska ha. Färgkoden fungerar så här:

Tecknen efter # kan delas upp i tre grupper med två tecken vardera (7D BD E3). De talar om hur mycket rött, grönt och blått som ska blandas för att skapa den bakgrundsfärg man vill ha. Den första gruppen innehåller det hexadecimala värdet för mängden röd färg, nästkommande grupp hur mycket grönt och sista gruppen hur mycket blått som ska ingå i bakgrundsfärgen. I vårt exempel betyder det att vi vill ha CC (125 decimalt) röd färg, BD (189 decimalt) grönt och E3 (227 decimalt) blått. En hög siffra betyder att det ska vara mycket av färgen och en låg siffra att det ska vara lite. Minimum är 00 (ingen färg) och maximum är FF (max färg). Vår bakgrundfärg innehåller ganska mycket blått, lite mindre grönt och ännu mindre rött. Det blir en ljusblå nyans. Om du inte vill prova dig fram kan du använda någon av nedanstående färger.

000000 = svart
FFFFFF = vitt
FF0000 = rött
00FF00 = grönt
0000FF = blått
FFFF00 = gult
00FFFF = cyan
FF00FF = lila

Saknar du någon färg? Experimentera med andra värden. Vill du ha förslag på fler färger finns det en färgtabell med HTML-värden här.


TEXT, LINK, VLINK och ALINK anger vad det ska vara för färg på text, obesökta länkar, besökta länkar och länkar i det ögonblick du klickar på dem. Färgkoderna fungerar på samma sätt som med BGCOLOR.

HTML-koden <HR WIDTH=”100%” /> betyder att här vill vi ha ett horisontellt streck (horisontal rule) som har en längd som motsvarar 100 procent av skärmens bredd. Om du anger en bredd, men utelämnar %-tecknet betyder det att strecket ska vara så många pixlar brett. <HR WIDTH=620 /> betyder att strecket nästan räcker hela vägen över en skärm som är 640 pixlar bred.

Jag skrev tidigare att de flesta koder fungerar likadant, med en startkod och en slutkod. Här har vi ett undantag från det. Det finns koder som inte ändrar ett utseende och som därför inte behöver en slutkod. I dessa kombinerar man ihop start- och slutkod till en genom att sätta ett mellanslag och “/” före den avslutande > så att det blir till exempel <HR /> (horisontellt streck) eller <BR />(radbrytning) i stället för <HR></HR> och <BR></BR>. De flesta webbläsare förstår även om du skulle skriva <HR> eller <BR>.

Om du vill kan du även ändra färgen på text. <FONT COLOR=”#FF0000″> gör efterföljande text röd. </FONT> ändrar tillbaka till vanlig färg. Färgkoderna är desamma som för till exempel bakgrundsfärg.

Spara dokumentet under namnet lektion3.htm och se hur det ser ut. Det ser ut så här.

Lektion 3 - HTML på svenska

Klicka för att förstora

I nästa lektion ska vi lägga till länkar.