Button Links:

Frage:
Wie lassen sich Buttons mit CSS gestalten?
Lösung:

Hier ist ein kleines CSS Beispiel für mit CSS gestaltete Buttons mit Hover-Effekt:

/* Grundsätzliches Aussehens des Buttons */
a.button 
{
  border-width: 3px;
  border-color: #F4F5F4 #D2D3D2 #D2D3D2 #F4F5F4;
  border-style: solid;
  padding: 3px 6px 3px 6px;
  background-color: #E0E0E0;
  color: black;
  text-decoration: none;
}
/* Hover Effekt nach Win XP Style */
a.button:hover 
{
  border-color: #FBDB6B #E4CF82 #E4CF82 #FBDB6B;
}
/* 3D Effekt beim Klicken des Buttons */
a.button:active 
{
  border-color: #D2D3D2 #F4F5F4 #F4F5F4 #D2D3D2;
}

Eine Demo:

de.selfhtml.org

tutorial.riehle-web.com

Und ein normaler Link:

en.selfhtml.org

© 2005, Dennis Riehle.