Leksjon 1

Grunnleggende html

Det første vi må gjøre er å lære noen grunnregler for HTML. Hvis du er helt ukjent med programmering i HTML eller vil lære mer kan du lete på nettet og finne mange meget gode læresider. Her vil du kun få med deg det aller nødvendigste for å kunne strukturere og utforme siden din. Begynn med å åpne notisblokken i Windows eller Enkel tekst i OSX. Skriv så inn følgende kode:

<html>
<head>
<title>
CSS-leksjoner
</title>
</head>
<body>
Her er noe jeg har skrevet
</body>
</html>

Lagre denne teksten ("Lagre som" eller "Arkiver som" i filmenyen eller arkivmenyen.) i en egen tom mappe og kall den for index.html

Start så en nettleser, f.eks Safari, Opera eller Internet Explorer, og åpne filen. ("Åpne fil" fra arkivmenyen eller filmenyen) Den burde se slik ut:

Alt som begynner med < og slutter med > kaller vi for en tagg. (Engelsk: tag) De fleste tagger er såkalte containertagger. Det betyr at mellom start-taggen <title> og slutt-taggen </title> bør det være et innhold. Det betyr også at foran og bak innholdet bør det være en start- og en slutt-tag. I dette tilfellet er innholdet "CSS-leksjoner", og denne teksten finner vi igjen i tittelfeltet på nettleseren. Forskjellen på start-taggen og slutt-taggen er altså tegnet "/", som alltid står først i en slutt-tagg. I selve innholdsvinduet i nettleseren, det hvite arket, kan vi lese det vi skrev mellom den start- og slutt-taggen som heter "body". Alt av tekst og bilder som befinner seg mellom <body> og </body> vil vises på siden. Iallefall foreløpig...

Dokumentet trenger altså bare disse taggene for å fungere. Den første, <html>, markerer starten på koden som nettleseren skal prøve å forstå. Siden den er en containertagg, vil vi altså finne en </html> som siste linje i dokumentet. Så kommer hodet, eller <head>. I hodet kan vi legge flere ting, og disse vil ikke vises direkte på siden vår, men vil ha betydning for det som presenteres. Inne i hodet har vi her skrevet tittelen på siden i containertaggen som heter "head". Når hodet slutter, </head>, begynner kroppen, altså <body>. Nå er vi klar til å fylle kroppen med innhold.

Hvis du har skrevet riktig (nettlesere tåler ikke skrivefeil i kodene) og har klart å lagre og åpne den første siden din, er du klar for leksjon 2.