CSS-egenskap: Skillnad mellan sidversioner

Från Webbling
Hoppa till: navigering, sök
(Skapade sidan med 'CSS-egenskaperna styr hur ett HTML-element ska visas. Det finns en uppsjö av olika egenskaper. I varje CSS-regel anges egenskaperna inom ett "{}"-...')
 
Ingen redigeringssammanfattning
 
(4 mellanliggande sidversioner av samma användare visas inte)
Rad 1: Rad 1:
CSS-egenskaperna styr hur ett [[HTML-element]] ska visas. Det finns en uppsjö av olika [[egenskapslista|egenskaper]].
[[CSS-egenskapslista|CSS-egenskaper]]na styr hur ett [[HTML-element]] ska visas. Det finns en uppsjö av olika [[CSS-egenskapslista|CSS-egenskaper]].


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 "<code>{}</code>"-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 "<code>:</code>"-tecken, följt av det värde man vill sätta egenskapen till. Deklarationen avslutas sedan med ett "<code>;</code>"-tecken. Om det är den sista egenskapen som ska sättas i ett block, kan man utelämna "<code>;</code>"-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 "<code>;</code>"-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 "<code>;</code>":et tidigare och så blir CSS-reglerna fel.


Ett exempel på en CSS-regel:
Ett exempel på en CSS-regel:
<syntaxhighlight lang="html5">
<syntaxhighlight lang="css">
p {
p {
   background-color: white;
   background-color: white;
Rad 10: Rad 10:
}
}
</syntaxhighlight>
</syntaxhighlight>
I ovanstående exempel ändrar man på två egenskaper, dels sätter man bakgrundsfärgen till vit och dels sätter man förgrunds-/textfärgen till svart.
I ovanstående exempel ändrar man på två egenskaper, dels sätter man bakgrundsfärgen till vit och dels sätter man förgrunds-/textfärgen till svart.

Nuvarande version från 10 januari 2019 kl. 12.52

CSS-egenskaperna styr hur ett HTML-element ska visas. Det finns en uppsjö av olika CSS-egenskaper.

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.

Ett exempel på en CSS-regel:

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

I ovanstående exempel ändrar man på två egenskaper, dels sätter man bakgrundsfärgen till vit och dels sätter man förgrunds-/textfärgen till svart.