- CSS链接效果，一共有两种，第一种是鼠标经过链接时为链接增加背景色，第二种是经过链接时，为链接增加背景图片，一个圆角的链接图片，大大增加了链接的美观度，由第二种可很方便的扩展成一个导航菜单。
<html>
<head>
<meta charset=”utf-8″ />
<title>html5 a背景改变</title>
<style>
.-abc a{ color:#000}
.-abc a:hover{color:#FFF; background:#00F}
.-def a{ color:#000; padding:10px 10px; line-height:30px}.-def a:hover{color:#FFF; background:url(http://www.codefans.net/jscss/demoimg/201310/bj.gif) no-repeat center}
#n{margin:10px auto; width:920px; border:1px solid #CCC;font-size:12px; line-height:30px;}
#n a{ padding:0 4px; color:#333}
</style>
</head>
<body>
<p><strong>鼠标经过文字链接背景变为有颜色背景</a>效果如下：</p>
<p><div class=”-abc”><a href=”http://www.codefans.net”>HTML5</a>
</div></p>
<p> </p>
<p><strong>鼠标经过文字链接背景变为图片</a>效果如下：</p>
<p>
<div class=”-def”><a href=”/”>HTML5</a>
</div></p>
</body>
</html>
http://www.codefans.net/jscss/code/4573.shtml
Leave a reply