下面我們給大家介紹一下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仿按鈕的制作方法了。希望大家繼續關注我們的網站!