CSS introduktion

Hvad er CSS?

  • CSS er en Cascading Style Sheet* (Cascading Style Ssheets)
  • CSS beskriverHvordan HTML-elementer vises på skærm, papir eller andre medier
  • CSS besparede meget arbejde。Det kan kontrollere layout på flere websider samtidig
  • Eksterne stilark gemmes i CSS-fil

*:Også kendt som Cascading Style Sheets.

CSS-demonstration - en HTML-side - flere stilarter!

Her er en HTML-side, der indeholder fire forskellige stilark. Klik på de nedenstående stilark-inks for at se forskellige stilarter:

Hvorfor bruge CSS?

CSS bruges til at definere stilen på websider, herunder design og layout til forskellige enheder og skærmstørrelser.

CSS eksempel

body {
  background-color: lightblue;
}
h1 {
  color: white;
  text-align: center;
}
p {
  font-family: verdana;
  font-size: 20px;
}

Prøv det selv

CSS løste et stort problem

HTML varken var designet til at indeholde tags til at formatere websider!

Målet med at skabe HTML erBeskriv webstedetIndhold, såsom:

<h1> Dette er en titel.</h1>
<p> Dette er en afsnit.</p>

Efter at have tilføjet tags som <font> og farveegenskaber til HTML 3.2-specifikationen begyndte mareridtet for webudviklere. Udviklingen af store websteder involverede at tilføje skrift- og farveinformationer til hver side, hvilket blev en lang og dyr proces.

For at løse dette problem oprettede World Wide Web Consortium (W3C) CSS.

CSS fjernede stilarter format fra HTML-siderne!

Hvis du ikke ved, hvad HTML er, anbefales det, at du læser HTML tutorial.

CSS sparer meget arbejde!

Stildefineringer gemmes normalt i eksterne .css filer.

Ved at bruge eksterne stilarter filer, skal du kun ændre en fil for at ændre hele webstedets udseende!