Example Menu two
Bookmark on del.icio.us
Tweet
Tweet
Example Menu two
Information
Another change of border style on hover to give the effect of a button press.
This is a quick and easy method of creating a button, but if you want something a bit more lifelike then see the ultimate button menu.
CASCADING STYLE SHEET
#menu a, #menu a:visited {
position:relative;
text-decoration:none;
text-align:center;
background-color:#9ab;
color:#fff;
display:block;
width:10em;
border:2px solid #fff;
border-color:#def #678 #345 #cde;
padding:0.25em;
margin:0.5em auto;
}
#menu a:hover {
top:2px;
left:2px;
color:#fff;
border-color:#345 #cde #def #678;
}
XHTML
<div id="menu">
<a href="#nogo">Item 1</a>
<a href="#nogo">Item 2</a>
<a href="#nogo">Item 3</a>
<a href="#nogo">Item 4</a>
<a href="#nogo">Item 5</a>
</div>
No comments yet.