CSS-regler: Skillnad mellan sidversioner

Från Webbling
Hoppa till: navigering, sök
Ingen redigeringssammanfattning
Ingen redigeringssammanfattning
Rad 1: Rad 1:
CSS-regler består av två delar. Vi har först en selektor, som är en sats som skapar ett urval av specifika HTML-element och som därmed bestämmer vilka element som ska påverkas av en specifik CSS-regel. Därefter följer en specifikation för vilka egenskaper som ska förändras för de utvalda elementen.
CSS-regler består av två delar.
 
1) Vi har först en selektor, Den används för att bestämma vilka element som ska påverkas av en specifik CSS-regel. Det finns många olika typer av selektorer.
 
2) Efter selektorn följer en specifikation för vilka egenskaper som ska förändras för de utvalda elementen. Se [[Selektor||selektor-sektionen]] för mer information.


I varje CSS-regel anges egenskaperna inom ett "{}"-block. Inuti blocket deklarerar man sedan egenskaperna var för sig. Detta gör man genom att först ange vilken egenskap man vill förändra, följt av ett ":"-tecken, följt av det värde man vill sätta egenskapen till. Deklarationen avslutas sedan med ett ";"-tecken. Om det är den sista egenskapen som ska sättas i ett block, kan man utelämna ";"-tecknet. Det är dock en bra vana att alltid skriva dit det, då blir det aldrig fel. Låt säga att du utelämnar ";"-tecknet, återkommer för att redigera regeln och lägger till något sist, då är det lätt att glömma att man utelämnat ";":et tidigare och så blir CSS-reglerna fel.
I varje CSS-regel anges egenskaperna inom ett "{}"-block. Inuti blocket deklarerar man sedan egenskaperna var för sig. Detta gör man genom att först ange vilken egenskap man vill förändra, följt av ett ":"-tecken, följt av det värde man vill sätta egenskapen till. Deklarationen avslutas sedan med ett ";"-tecken. Om det är den sista egenskapen som ska sättas i ett block, kan man utelämna ";"-tecknet. Det är dock en bra vana att alltid skriva dit det, då blir det aldrig fel. Låt säga att du utelämnar ";"-tecknet, återkommer för att redigera regeln och lägger till något sist, då är det lätt att glömma att man utelämnat ";":et tidigare och så blir CSS-reglerna fel.

Versionen från 10 januari 2019 kl. 11.00

CSS-regler består av två delar.

1) Vi har först en selektor, Den används för att bestämma vilka element som ska påverkas av en specifik CSS-regel. Det finns många olika typer av selektorer.

2) Efter selektorn följer en specifikation för vilka egenskaper som ska förändras för de utvalda elementen. Se |selektor-sektionen för mer information.

I varje CSS-regel anges egenskaperna inom ett "{}"-block. Inuti blocket deklarerar man sedan egenskaperna var för sig. Detta gör man genom att först ange vilken egenskap man vill förändra, följt av ett ":"-tecken, följt av det värde man vill sätta egenskapen till. Deklarationen avslutas sedan med ett ";"-tecken. Om det är den sista egenskapen som ska sättas i ett block, kan man utelämna ";"-tecknet. Det är dock en bra vana att alltid skriva dit det, då blir det aldrig fel. Låt säga att du utelämnar ";"-tecknet, återkommer för att redigera regeln och lägger till något sist, då är det lätt att glömma att man utelämnat ";":et tidigare och så blir CSS-reglerna fel.

Exempel

Ett exempel på en CSS-regel:

p {
  background-color: white;
  color: black;
}

I ovanstående exempel väljer man ut alla p-element. Regeln ändrar på två egenskaper: Dels sätter man bakgrundsfärgen till vit, dels sätter man förgrunds-/textfärgen till svart.