F2 - Introduktion till CSS

Se föreläsningsbilderna här!


Under denna föreläsning bygger vi ut våra kunskaper inom HTML, genom att lägga till ett annat märkspråk: CSS (L).

CSS-kod läggs i ett html-dokument mellan <style>-taggar (L) eller länkas från en extern CSS-fil genom en <link>-tagg (L). I de flesta fall rekommenderar jag att använda en extern fil, dels för att separera olika språk, dels för att göra mängden kod i HTML-filen mindre, och slutligen för att kunna återanvända samma CSS-kod i flera filer.

CSS-kod byggs upp utav block som ser ut såhär:

[selector] {
[attribute]: [value];
[attribute]: [value];
..
}

Varje block väljer då ut ett antal element från HTML-sidan utifrån sin selector, och ändrar varje attribut i listan mellan parenteserna (måsvingarna) till värder som är specificerat där. Ett sådant block kan ha flera selektorer, som skrivs efter varandra och separeras med kommatecken.

Ni behöver känna till flera selektorer:

Dessutom behöver ni känna till ett antal attribut.

Läs även om attributed Display (L), vilket är vad som separerar en <div> från en <span>. Sen är även deras sida om Enheter (L) bra.

När det gäller alla läshänvisningar på denna sida, är det viktigt att ni inte bara läser den sidan, utan även alla relaterade ämnen i menyn på w3school. Kika i menyn till vänster, och de ämnen som ligger under samma kategori som det länken länkar till.