13. Style sheets
Style sheets er en ret ny ting, og grunden til jeg har valgt at inkludere det på
disse sider, er at der er fremtid i dem. HTML OG HJEMMESIDER er centralt opbygget
omkring Style sheets, og vil derfor blive brugt som eksempel flere gange.
Style sheets er en let metode til at fastsætte layout og det generelle design af et
HTML dokument, da alle specifikationer er defineret i en seperat fil, som alle HTML dokumenter
refererer til. På den måde kan man f.eks. ændre baggrundsfarve på alle HTML dokumenter
på en gang, eller skifte skrifttype lynhurtigt. Så det er en del lettere at arbejde med,
og man sparer en del tid. Desværre er der det sædvanlige problem, Microsoft og Netscape
krigen, de to krigsherrer er ikke kommet til fornuft endnu. Indtil videre er det kun
Microsoft Internet Explorer 4.0 som understøtter Style sheets fuldt ud, det er også derfor
jeg anbefaler den browser til disse sider.
Sammen med Style sheets er der kommet en masse nye opsætningsmuligheder, f.eks.
ligestilling af tekstkanter og uafhængig placering af billeder via koordinater. Jeg
vil ikke beskrive alle funktionerne i Style sheets, da dette i så fald ville fylde som
en bog, jeg vil istedet prøve at beskrive nogle udpluk af disse siders Style sheet fil,
for at give en fornemmelse af hvor smart det egentlig er. Det letteste måde at lave
Style sheets på, er med et program specielt til det, da det sparer dig tid og arbejde,
du kan finde links til sådanne programmer under links ude til venstre.
Opsætningen af HTML OG HJEMMESIDER:
Opsætningen af disse sider er som sagt, udelukkende opbygget omkring én enkel fil, du
kan se den ved at trykke her: stilen.css
Inde i css filen er der opsætninger af alle de brugte tag's på disse sider, f.eks.
<body>, hvor skrifttype og størrelse er defineret. Det smarte er så at den <body>
gælder for alle sider som har:
<link rel="stylesheet" type="text/css" href="stilen.css">
placeret mellem <head> og </head>. Det samme gælder for de andre tag's.
Det er så muligt at give tag'sene efternavn i css filen, f.eks. sådan her: BODY.start
hvilket gør at man kan lave specielle specifikationer for enkle sider, hvor man så i
selve tag'et skal referere til efternavnet, f.eks. sådan her:
<body Class="start">
Der er så nogle små smarte funktioner, f.eks. når du i Internet Explorer fører musepilen
over et link, så ændrer farven på linket sig. Det er lavet sådan her:
A:hover {color: #ff0000;}
Dvs. når musepilen kører over linket, så skifter det til den farve, i dette tilfælde rød.
Det skal defineres i css filen ligeså.
Der er tusinde flere funktioner, og hvis du vil vide mere, så kig i links sektionen
ude til venstre.