INFORMATION <BR />
Another change of border style on hover to give the effect of a button press. <BR />
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. <BR />
CASCADING STYLE SHEET <BR />
#menu a, #menu a:visited { <BR />
position:relative; <BR />
text-decoration:none; <BR />
text-align:center; <BR />
background-color:#9ab; <BR />
color:#fff; <BR />
display:block; <BR />
width:10em; <BR />
border:2px solid #fff; <BR />
border-color:#def #678 #345 #cde; <BR />
padding:0.25em; <BR />
margin:0.5em auto; <BR />
} <BR />
<BR />
#menu a:hover { <BR />
top:2px; <BR />
left:2px; <BR />
color:#fff; <BR />
border-color:#345 #cde #def #678; <BR />
} <BR />
XHTML <BR />
<div id="menu"> <BR />
<a href="#nogo">Item 1</a> <BR />
<a href="#nogo">Item 2</a> <BR />
<a href="#nogo">Item 3</a> <BR />
<a href="#nogo">Item 4</a> <BR />
<a href="#nogo">Item 5</a> <BR />
</div> <BR />
Another change of border style on hover to give the effect of a button press. <BR />
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. <BR />
CASCADING STYLE SHEET <BR />
#menu a, #menu a:visited { <BR />
position:relative; <BR />
text-decoration:none; <BR />
text-align:center; <BR />
background-color:#9ab; <BR />
color:#fff; <BR />
display:block; <BR />
width:10em; <BR />
border:2px solid #fff; <BR />
border-color:#def #678 #345 #cde; <BR />
padding:0.25em; <BR />
margin:0.5em auto; <BR />
} <BR />
<BR />
#menu a:hover { <BR />
top:2px; <BR />
left:2px; <BR />
color:#fff; <BR />
border-color:#345 #cde #def #678; <BR />
} <BR />
XHTML <BR />
<div id="menu"> <BR />
<a href="#nogo">Item 1</a> <BR />
<a href="#nogo">Item 2</a> <BR />
<a href="#nogo">Item 3</a> <BR />
<a href="#nogo">Item 4</a> <BR />
<a href="#nogo">Item 5</a> <BR />
</div> <BR />
回复Comments
{commenttime}{commentauthor}
{CommentUrl}
{commentcontent}