下面我们给大家介绍一下html5仿按钮的制作方法吧!希望大家可以在这里学习!
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<head>
<title>仿按钮效果的导航菜单</title>
<FCK:meta http-equiv="content-type" content="text/html;charset=gb2312" />
<!--把下面代码加到<head>与</head>之间-->
<style type="text/css">
#navigation{
font-size:90%
}
#navigation ul{
list-style:none;
margin:0;
padding:0;
padding-top:1em;
}
#navigation li{
display:inline;
}
#navigation a:link,#navigation a:visited{
margin-right:0.2em;
padding:0.2em 0.6em 0.2em 0.6em;
color:#A62020;
background-color:#FCE6EA;
text-decoration:none;
border-top:1px solid #FFFFFF;
border-left:1px solid #FFFFFF;
border-bottom:1px solid #717171;
border-right:1px solid #717171;
}
#navigation a:hover{
border-top:1px solid #717171;
border-left:1px solid #717171;
border-bottom:1px solid #FFFFFF;
border-right:1px solid #FFFFFF;
}
</style>
</head>
<body>
<!--把下面代码加到<body>与</body>之间-->
<div id="navigation">
<ul>
<li><a href="#" _fcksavedurl="#">11</a></li>
<li><a href="#" _fcksavedurl="#">22</a></li>
<li><a href="#" _fcksavedurl="#">33</a></li>
<li><a href="#" _fcksavedurl="#">44</a></li>
</ul>
</div>
</body>
</html>
以上就是我们给大家介绍的html5仿按钮的制作方法了。希望大家继续关注我们的网站!