用CSS样式制作按钮式超链接

a:link--用来定义未访问过的超链接样式

a:visited--用来定义访问过的超链接样式

a:active--用来定义活动的超级链接(即获得当前焦点的链接)

a:hover--用来定义有鼠标悬停的链接样式

<html>
	<head>
		<style type="text/css">
			a{
					font-family:Arial;
					font-size:21px;
					text-align:center;
					margin:3px;
			}
			a:link,a:visited{
					color:#002020;
					backgroud-color:blue;
					border-top:1px solid #EE00EE	/*边框阴影效果*/
					border-left:1px solid #EE00EE
					border-bottom:1px solid #720072
					border-right:1px solid #720072
					
			}
			a:hover{
					color:#930220;	                /*改变文字颜色*/
					padding:5px 8px 3px 12px;
					backgroud-color:green;		/*改变背景颜色*/
					border-top:1px solid #720072	
					border-left:1px solid #720072
					border-bottom:1px solid #EE00EE
					border-right:1px solid #EE00EE
			}
		  </style>
	</head>
  <body>
	<a href="#">Back to Home</a>
  </body>
</html>

相关推荐