电脑技术学习

CSS制作3D风格的网页按钮特效代码

dn001

<html>
<body>
<style type="text/css">

#elButton a; {

color: #000000;

font-size:10px;

font-family:verdana;

font-weight:bold;

text-decoration: none;

border:4px outset aqua;

background-color:#00ffff;

display: block;

width: 160px;

padding: 3px 5px;

margin: 1px;

}

#elButton a:hover {

background-color: #00c0c0;

color:#000000;

padding-left:4px;

border:4px inset aqua;

}

#elButton a; {

color: #000;

font-size:10px;

font-family:verdana;

font-weight:bold;

text-decoration: none;

border:4px outset aqua;

background-color:#00ffff;

display: block;

width: 160px;

padding: 3px 5px;

margin: 1px;

}

#elButton a:hover {

background: #00c0c0;

color:#000000;

padding-left:4px;

border:4px inset aqua;

}

</style>
</head>
<body>

<div id="elButton">

<div>

<a href="#">Java Script</a>

</div>

<div>

<a href="#">Dynamic HTML</a>

</div>

<div>

<a href="#">Server Side</a>

</div>

<div>

<a href="#">Client Side</a>

</div>

</div>
</body>
</html>