网站首页
高清电影
无损音乐
游戏攻略
电脑教程
破解资源
站长资源
软件下载
鼠标移入移出改变CSS样式的小例子
(编辑：jimmy 日期: 2025/7/2 浏览：
2
)
网页上的某个区域，当鼠标移入时改变样式，鼠标移出时自动恢复样式，可以是一个图片的边框，也可以一段文字变色，掌握了原理，貌似可以做更加丰富生动的网页互动效果，这里主要是利用Js控制Hover标签所在的DIV产生动作，也是学习的好范例。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>鼠标移入移出改变CSS样式</title><style> body{color:#fff;font:12px/1.5 Tahoma;}#div1{width:150px;height:150px;margin:0 auto;padding:10px;background:black;border:10px solid #000;cursor:crosshair;}#div1.hover{color:red;background:#f0f0f0;border:10px solid red;}</style></head><body>鼠标移入改变样式，鼠标移出恢复。</body></html>
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
上一篇：
js循环改变div颜色具体方法
下一篇：
js点击更换背景颜色或图片的实例代码
首页
音乐
电影
资源