|
|
Att använda stilmallar
och hitta genvägen till en snygg sida
Nytt år och nya tag. Här får du lära dig den största av hemligheterna bakom en snygg hemsida stilmallar.
Med ett par knapptryck kan du bestämma att en text ska vara rubrik, och med ytterligare några knapptryck kan du ange att rubriken ska vara i ett visst typsnitt.
Men om du efter ett tag vill ändra rubriktypsnittet på alla dina webbsidor måste du gå igenom varje sida och ändra på dem allihop? Nej, inte om du använder dig av stilmallar.
Med hjälp av stilmallar kan du enkelt definiera hur varje element (till exempel brödtext, rubrik och länk) ska tolkas av webbläsaren. Oavsett om det handlar om typsnitt, storlek, position eller färg. Ungefär på samma sätt som du använder formatmallar i ett ordbehandlingsprogram. Det finns bara en liten hake. Du får inte ha formaterat texten och bestämt typsnitt i efterhand. Eftersom det inte finns så många hemsidesprogram som är bra på att hantera stilmallar, gör vi stilmallen för hand.
Så gör du stilmallen  Före stilmall |
Öppna en texteditor, t ex Notepad. Skriv in de element du vill ändra utseendet på, vart och ett på en egen rad.
Elementet P används för brödtext, H1 för stor rubrik, H2 för mindre rubrik och H3 för ännu mindre rubrik. Det finns massor av element, men vi börjar så här.
P { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10pt }
H1 { font-family: Verdana, Arial, Helvetica, sans-serif; color: #990000 }
H2 { font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: normal; font-size: 14pt }
H3 { font-family: Verdana, Arial, Helvetica, sans-serif }
Så där, då är definitionerna av elementen klara. Det som står efter font- family är typsnittet som ska användas. Jag har angivit fyra stycken, och det är i vilken ordning typsnitten ska användas om det första inte finns installerat i besökarens dator. Font-size anger typsnittsstorleken, font-weight bestämmer om typsnittet ska visas som fet eller normal och slutligen color som bestämmer färgen.
Spara stilmallen i din hemsideskatalog där du har dina html-filer och ge den ett namn, förslagsvis hemsida.css. Css är en förkortning av det engelska uttrycket för stilmallar, Cascading Style Sheets.
Lägg in stilmallen
 Efter stilmall
|
På webbsidan där stilmallen ska in, skriver du bara till en liten rad mellan HEAD-märkena nästan högst upp i html-koden:
<LINK REL="stylesheet" HREF="hemsida.css">
Inom citattecknena efter HREF skriver du helt enkelt in namnet på stilmallen du har gjort. Tyvärr klarar varken Netscape Composer eller Frontpage Express av att hantera stilmallar i dag. Programmen som kostar pengar börjar däremot bli bättre på stilmallar.
Ett av de bästa heter Dreamweaver 2 och kommer från företaget Macromedia. Du kan själv hämta en provversion från adressen www.macromedia.com
Mer om stilmallar nästa söndag.
Björn E Olsberg
/teknisk redaktör på Internetworld.
Gå till förra html-lektionen. Del 6
|
|