Tips om stilmallar

Hur åstadkommer man det där lilla extra med stilmallar? Här hittar du en rad tips om detta.

Grunderna i hur du använder stilmallar hittar du i Stilmallsskolan.

Med en SPAN-tagg kan du visa text med en avvikande färg när musmarkören pekar på den. Var sparsam med den här funktionen, eftersom den lätt feltolkas som en länk. Koden fungerar i Internet Explorer och Netscape 6, men inte i Netscape 4.5. Kopiera koden 

Sätt färg på både bakgrund och text i en helt vanlig rullgardinsmeny. Den här stilmallen fungerar inte i Netscape 4 – där visas menyn som vanligt i stället. Kopiera koden

Rullningslisten i textarean kan skräddarsys helt enligt din smak. Fungerar ej i Netscape 4. Kopiera koden

Ändra färg på bakgrund och text i textarean. Fungerar ej i Netscape 4. Kopiera koden

Skapa annorlunda knappar genom att använda en bakgrundsbild. Fungerar ej i Netscape 4. Kopiera koden

Ge de klickbara knapparna en egen färg och bestäm samtidigt textfärgen. Fungerar ej i Netscape 4. Kopiera koden

Skapa en snygg rubrik utan att använda bilder. Kopiera koden

Du kan ange exakt var på sidan bilder skall visas. Det gör att du kan använda en vanlig länk för att byta ut en bild mot en annan. Kopiera koden

Visa två bilder på samma höjd och låt texten flöda mellan dem. Kopiera koden

Lägg en bakgrundsbild i textarean och ändra textfärgen så att kontrasten blir bra. Kopiera koden

När textarean blir aktiv byts bakgrundsbilden mot en annan bild, samtidigt som texten ändrar färg. Kopiera koden

Är standardavståndet mellan raderna för stort eller för litet kan du ändra den med en stilmall. Kopiera koden

Du kan lägga en liten bakgrundsbild längst till höger och upprepa den i y-led. Det här fungerar i Internet Explorer, men inte i Netscape. Kopiera koden

Låt textlänken byta färg när muspekaren förs över den. Kopiera koden

Om du inte vill ha dina textlänkar understrukna, ändrar du dem med stilmallen. Kopiera koden

Markera länkar med ett streck under och ett över dem. Kopiera koden

Framhäv text genom att byta färg på bakgrunden bakom texten. Kopiera koden

Ge texten en skugga genom att placera ut texten två gånger med en liten förskjutning – ett bra sätt att skapa en snygg rubrik utan att använda bilder eller konstiga teckensnitt. Kopiera koden

Sänk första bokstaven i ett textblock och gör den större än den övriga texten. Kopiera koden

Du kan justera textrutans text så att den placeras till vänster, centrerad eller till höger. Kopiera koden

Gör 3D-länkar med mouseover-effekt utan att använda bilder eller JavaScript. Kopiera koden

Du kan öka eller minska avståndet mellan bokstäverna i till exempel en rubrik. Fungerar ej i Netscape. Kopiera koden

Gör ett indrag i första raden av ett textavsnitt, men inte i de följande raderna. Kopiera koden

Bestäm om texten skall visas som versaler, gemener eller kapitäler. Kopiera koden

Du kan gömma ett element, till exempel en rubrik. Fungerar ej i Netscape. Kopiera koden

Du kan ge den första raden i en text ett eget utseende, medan resten av texten visas normalt. Fungerar ej i Netscape 4. Kopiera koden

Ge den första bokstaven i en text en annan färg än resten av texten och gör den större. Fungerar ej i Netscape. Kopiera koden

Du kan flytta ett element, till exempel en rubrik, till höger eller till vänster. Kopiera koden

Genom att bilden placeras med "float" längst till vänster eller till höger, kan texten flöda bredvid bilden. Kopiera koden

Du kan ändra radavståndet i utvalda textavsnitt. Kopiera koden

I stället för standardpunkterna i oordnade listor kan man använda en bild. Kopiera koden

Du kan bestämma var markeringen för de olika punkterna i listor skall visas. Kopiera koden

Några olika sätt att åstadkomma ramar kring text. Fungerar ej i Netscape.  Kopiera koden

Låt bakgrundsbilden ligga stilla medan sidans innehåll "rullas" över den. Fungerar ej i Netscape.  Kopiera koden

Placera bakgrundsbilden till vänster, i mitten eller till höger. Fungerar ej i Netscape.  Kopiera koden

Upprepa bakgrundsbilden längs sidan, men låt den ligga stilla bakom sidans innehåll. Fungerar ej i Netscape. Kopiera koden