Färger och bakgrundsfärg

1. Infoga färger med Cascading Style Sheets

När det gäller färger kan vi benämna dem på olika sätt. Vi kan skriva den i hexadecimal: #ffffff, men till detta kommer också möjligheten att skriva den i en kortvariant: #fff. Den första bokstaven representerar färgen rött, den andra grönt och den tredje blått. Sedan kan vi också ange färgen i RGB värden, dels i siffror och dels i procent. RGB står för red, green och blue. Också denna skala består av tre positioner, de redan nämnda. Slutligen kan vi skriva ut färgnamnet på engelska.

Bakgrundsfärgen vitt skulle kunna skrivas på följande fem sätt:

<style type="text/css">  </style>

Jag bör kanske påpeka att ff och f i hexadecimal, samt 255 i RGB-skalan betyder fullt mått av aktuell färg. Läs mer om hexadecimal och RGB i avsnittet om färger!

När det gäller det sista alternativet, kan vi använda färgnamnen: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white och yellow.

När vi skall ange en fontfärg, använder vi egenskapen color:. Men när vi skall ange en bakgrundsfärg för hela sidan, för ett visst avsnitt eller för ett enstaka ord, använder vi istället egenskapen background-color:

2. Bakgrundsfärg åt sidan

När vi skall ge sidan en bakgrundsfärg genom CSS, anger vi dessa egenskaper och värden i selectorn body. En kod för detta ändamål kan ha följande utseende:

<html> <head> <title>Bakgrundsfärg</title> <style type="text/css">  </style> </head> <body> Sidan som vanligt. Massor av text.. </body> </html>

Nu har jag angivit en ljusblå bakgrundsfärg och dessutom har jag angivit vilket typsnitt vi skall ha, d.v.s Verdana i första hand och att storleken skall vara 14pt. I andra hand gäller Arial och i tredje Sans-Serif. Om inte mottagarnas datorer klarar av att läsa typsnittet vi valt i första hand, kommer den att välja det som är angivet i andra hand. I tredje hand kan anges ett som alla datorer klarar av. Här har jag valt Sans-Serif och när typsnittet består av flera ord, bör jag sätta det inom de tecken jag skrivit.

Slutligen har jag valt en blå textfärg för mina bokstäver.

3. Bakgrundsfärg åt visst avsnitt/ord

Vi kan inte bara skapa en bakgrundsfärg åt sidan, utan också skapa bakgrundsfärger åt vissa ord eller meningar som vi kanske vill framhäva lite extra.

<style type="text/css">  </style>

Och i html-koden:
Nu har <span class="pass">denna del</span> en blå bakgrundsfärg med vit text.

Nu har denna del en blå bakgrundsfärg med vit text.





kontakt	© Stefan Dahlén	Tisdag 7:e oktober 2008