Tilbake til startsida IKT i praksis. Stilark


Kvifor stilark?

Nettsider er (stort sett) programmerte med html- eller php-kode eller variantar av desse. I tillegg bruker mange også skript, t.d. Javascript, stilark (CSS) og ein del andre ting for å gjere programmeringa og vedlikehaldet enklare og for å gi sidene ein layout som ikkje er råd å få til med rein html-kode. Skript kan vere ganske nyttige, men diverre kan brukaren slå av bruken av skript som blir køyrde frå datamaskinen. Desse sidene er laga i ei blanding av vanleg html-kode og php. PHP kan også sjåast på som skript, men er utilgjengeleg for brukaren og kan difor heller ikkje slåast av. Går du inn på kjeldekodane for desse sidene, finn du bare html og stilark. PHP ligg igjen på servaren («nettenaren» på offisielt norsk).

For dei fleste er difor stilark den praktiske løysinga. Bruken av stilark har vore noe hemma av at mange nettlesarar («browsers») anten ikkje kunne lese CSS-kodene eller tolka dei feil. Dette er det nå stort sett slutt på nå. Dermed er det på tide å utnytte stilarka fullt ut, ikkje bare til å formatere skrift og bakgrunnar på nettsidene. Rett nok kan brukaren slå av også stilarka, men dei færraste er klar over at det kan gjerast og endå færre gjer det.

Du kan lage bra nettsider i html utan stilark, men det er ingen vits i å lage stilark utan i samanheng med html. Stilarka blir brukte for å omdefinera normalverdiane sette i html, og også innføre noen nye eigenskapar.

Sidan både html og css bygger på engelsk, har eg vald å bruke dei engelske fagtermane. Dette for å gjere det enklare å kunne lese annan litteratur om emnet. Eg reknar med at du har kjennskap til koding i html. Det er lite vits i å kode i CSS utan samstundes å kode i html.

Desse sidene blei laga fordi eg hadde bruk for å setje meg grundigare inn i CSS. Det er difor ikkje ei vanleg, systematisk lærebok i stilark, men meir eit resultat av dei behova eg hadde. Etter kvart har eg også lagt til litt om dei meir vanlege kommandoane for eventuelt å hjelpe i gang andre til å bruke dette hjelpemiddelet.

Alle tipsa, og også desse sidene, er prøvde ut i Firefox 3.0, Opera 10 og Intenet Explorer 8.0. Det meste er skrive for bruk med CSS 2 men mykje verkar også i CSS 1. CSS 3 er førebels for lite utbygd til å ha praktisk nytte.

Som du sikkert har eller vil oppdaga, bruker eg også desse sidene som forsøk på ulike verknader av stilarka. Reknar med at dei fleste innslaga blir kommenterte ein eller annan stad i teksten, men du får orsaka meg om du finn bruk av stilark som ikkje er forklarte. Send eventuelt ein e-post, så ordnar vi det. Adressa nedst på sida.

Internet Explorer

Alle lærestader inneheld gjerne noen kapittel om Internet Explorer (IE). Ikkje så rart, IE var og er mykje brukt, men Microsoft var utruleg seine til å etterleve standard. Først frå versjon 7 og oppover verkar det meste også i IE dersom toppen av kodene for nettsida inneheld "DOCTYPE".

Opphavleg rekna eg manglane i IE 6 som uaktuelle nå i og med at det meste er retta opp i nyare versjonar. Så fekk eg greie på at fleire firma faktisk bruker denne gamle versjonen framleis. Dei reknar han for sikrare enn versjon 7 og 8. Difor har eg kommentert i omtalane (der eg har hugsa det) dei tilfella der stilkodane ikkje verkar i IE 6.

Kva som elles skal stå på toppen av kodesida er avhengig av kva koding du brukar men eksemplet nedanfor skulle verke bra i dei fleste tilfella:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    ...
  </head>
  <body>
    ...
  </body>
</html>

Ikkje skriv av den øvste setninga, men kopier ho. Bare ein einaste skrivefeil er nok til at koden ikkje verkar.

Kodene

Eg har ikkje funne noen grunn til å setje opp lister over tilgjengelege koder i stilarka. Det finst mange slike lister på Internett. Nettsida http://www.w3schools.com/CSS/ har eit fint oversyn. Vil du ha meir utførleg om kodene, kan du gå inn på http://www.w3.org/TR/CSS21/. Begge er på engelsk sjølv om den førstnemnde er frå ein norsk nettstad.

Validering

Ofte kan det vere vanskeleg og tidkrevjande å finne feil i stilark. Då kan sidene validator vere til god hjelp. Sidene gir tilbakemelding om alt er i orden eller om kva som eventuelt er feil i kodene dine.

For å gjere deg litt nysgjerrig: Både overskrifta på denne sida, menyen i venstremargen og streken nedst på sida og teksten under denne er laga med php og stilark. Dette kjem fram som html i kjeldekoden for sida.


Send melding

© Innhald og design:  Kolbjørn StuestølStuestøl heimesideSist endra 11. april 2013