BODY-taggen: Ändra bakgrundsfärg och textfärg

JavaScript.nu / HTML-kurs / Ändra bakgrundsfärg och textfärg

Ändra bakgrundsfärg och textfärg

I detta kapitel:
Ändra koden
Attributen
Test

Vid det här laget ska du i denna kurs ha skapat en första hemsida. Din sida innehåller än så länge inget annat än en svart text på en vit bakgrund. Vi ska nu göra några små uppdateringar för att ändra din sidas bakgrund och din sidas textfärg.
Öppna nu din hemsidefil (index.html) med webbläsaren och ändra sedan innehållet i filen till koden nedan:

<HTML> <HEAD> <TITLE>Rubrik på din sida</TITLE> </HEAD> <BODY BGCOLOR="green" TEXT="red"> Hej, detta är min första hemsida! </BODY> </HTML>

Spara nu dokumentet och öppna din sida i webbläsaren. Har du redan sidan öppen måste du uppdatera sidan. Med detta menas att trycker på Uppdatera-knappen (kan även heta "Reload" eller "Ladda om") så att webbläsaren visar sidan med de nya ändringarna. Bilderna nedan visar vilken knapp du trycker på för att uppdatera sidan:
Uppdatera sidan med Explorer

Din sida ska med de nya ändringarna se ut så här:
Första hemsidan med bakgrund

Som du ser har du nu fått en grön bakgrund och en röd text.
Vad är det du alltså har lagt till i din HTML-kod?
Jo, du har lagt till två "attribut". Ett attribut beskriver en tagg. Din BODY-tagg, som du nu alltså ändrat, är den tagg som beskriver hur din sida ska se ut. Denna tagg innehöll som synes inget när du först skapade din sida, och därför fick din sida standardfärgerna en vit bakgrund och en svart text. Efter din ändringen så har din BODY-tagg nu två attribut:

BGCOLOR (BackGroundCOLOR = bakgrundsfärg)
TEXT

Dessa beskriver vilken bakgrundsfärg och textfärg din sida ska ha. I vårt fall valde vi grönt respektive rött.
Det allmänna exemplet för hur en tagg ser ut är alltså:
<TAGG ATTRIBUT1="värde1" ATTRIBUT2="värde2" ... ATTRIBUTX="värdeX">

I vårt fall har vi alltså en tagg som heter BODY och två attribut som heter BGCOLOR och TEXT. Värdena på dessa är green och red. Vi får alltså detta resultat:
<BODY BGCOLOR="green" TEXT="red">

I förra kapitlet lärde du dig lite om vad taggar är och idag lär du dig vad attribut är. Fast eftersom dessa två begrepp är så otroligt viktiga så tillägnar vi hela nästa kapitel bara för att repetera och fördjupa oss i vad taggar och attribut är.

Bra, du är nu färdig med denna del av kursen. Framöver kommer denna kurs att ha en tabell som nedan för varje ny tagg du lär dig. Denna tabell kommer att "sammanfatta" den tagg (och de eventuella attributen) taggen har. Kursen kommer inte nödvändigtvis gå genom alla attributen för alla taggarna! Av denna anledning bör du inte heller försöka lära dig alla attributen utantill. Eftersom denna kurs endast tar upp de nödvändigaste attributen för de nödvändigaste taggarna så räcker det gott och väl att du lär dig de attribut som kursen går genom. I exemplet nedan är således endast attributen TEXT och BGCOLOR genomgångna i kursen, varför du för tillfället inte behöver lära dig de resterande attributen.

BODY

BODY bestämmer en sidas färguppsättning

Attribut

TEXT     Sidans textfärg

BGCOLOR     Sidans bakgrundsfärg

LINK     Sidans länkfärg

VLINK     Sidans färg på de besökta länkarna

ALINK     Sidans färg på de aktiverade länkarna

BACKGROUND     Adressen till en bakgrundsbild

BGPROPERTIES     Enda värdet är FIXED

Test

I slutet av varje kapitel i HTML-kursen finns några frågor som du ska svara på för att testa dina kunskaper inom HTML. Om du har fått alla rätt så är det bara att gå vidare, fast har du haft något fel kan det kanske vara klokt att försöka lista ut vad som kan ha varit fel. Givetvis kan du gå vidare även om du inte svarar rätt på alla frågor.

Vad menas med att uppdatera en sida i webbläsaren?
Att spara filen
Att ändra sidans färger
Att trycka på Uppdatera-knappen för att se HTML-dokumentets ändringar sedan man senast sparade det
Vad är ett attribut?
Samma sak som en tagg
Något som beskriver en tagg
Något som beskriver hemsidans färg