`

鼠标经过效果

    博客分类：
  • css
浏览器XHTMLHTML 
阅读更多
鼠标经过效果

------
效果概述：

鼠标经过，显示不同的 背景 的效果，

------
实现：

可以通过 <a> 的 :hover 实现，因为 :hover 被所有主流浏览器支持，因此有较好的兼容性，

------
例子： 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">
/* 鼠标经过效果，用 a 标签实现 */
.link_one,.link_one:link,.link_one:visited {width: 60px;height: 40px;color:#FFF;background-color: #0F0;text-decoration: none;}
.link_one:hover {background-color: #FF0;color:#F00;}
</style>
</head>
<body>
	<a href="#" class="link_one" onclick="alert(1);">link</a>
</body>
</html>


------
分享到：
| udp 简单使用
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics