Tips&Tricks

til hjemmesiden, computeren og internettet

Tips & Tricks



Knapper uden billeder

Sat på siden 18-02-2005

Noget af det mest effektive, du kan gøre, hvis du vil have gæster på din hjemmeside, er at lade den være læææænge om at downloade.

Du kan gøre din hjemmeside langsom med bl.a. billeder og tabeller.

Nå, men hvis du ikke ønsker at skræmme gæsterne væk, kan du bruge CSS (Stylesheets) til at undgå mange billeder og tabeller.

Prøv at se menuen på siden her: www.tips-og-tricks.com/eksempler/knapper.html

Knapperne er udelukkende lavet ved hjælp af stylesheets, og du kan naturligvis give dem en hvilken som helst farve.

I eksemplet har jeg valgt kun at have knapper på linkene foroven. Derfor har jeg oprettet en klasse, der hedder "knapper". CSS-koderne ser sådan her ud:

.knapper a:link, .knapper a:visited{
 text-decoration: none;
 font-family: sans-serif;
 font-weight: bold;
 color: Black;
 padding: 3px 20px 2px 20px;
 width: 200px;
 border: outset;
 border-color: Gray;
 background-color: #DCDCDC;
}

.knapper a:hover{
 text-decoration: none;
 font-family: sans-serif;
 font-weight: bold;
 color: Black;
 width: 200px;
 border: inset;
 border-color: Gray;
}

Inde i html-dokumentet kalder jeg klassen således:

<div class="knapper">
<a href="http://www.hovedbrud.com">Hovedbrud</a>
<a href osv.
</div>

Som du kan se af eksemplet, er der tale om kode, der følger standarden hos W3. Den validerer.

Denne bog ville jeg nødigt undvære!
www.kortlink.com/cssbog2

Kunne du lide tippet? Abonner gratis på mine nyhedsmails og få friske tips hver uge: Tilmelding til Tips og tricks
Lige nu: Få e-bogen "701 Tips og Tricks" gratis (normalpris $11,83) ved tilmelding.


|