1、鼠标离开的状态
2、鼠标经过 我爱学习 字体由“红色”改变为“黄绿色”,此时鼠标离开—框框3、鼠标经过 框框 时“浅蓝色”变为“黄绿色”,此时鼠标离开—我爱学习
代码编写如下;
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>鼠标移入时,改变字体的背景色,移出时,还原默认的背景色</title> <style> .xuexi{width:200px;height:120px;background:#abcdef;border:1px solid green;} </style> <script> function aixuexi(){ var woaixuexi=document.getElementById("woaixuexi"); woaixuexi.style.background="yellowgreen"; } function xuexi(){ var xuexi=document.getElementById("woaixuexi"); xuexi.style.background="#abcdef"; } function ziti(){ var ziti=document.getElementById("font"); ziti.style.color="yellowgreen"; } function zi(){ var ziti=document.getElementById("font"); ziti.style.color="red"; } </script> </head> <body><h1 id="font" onmouseover="ziti();" onmouseout="zi();" class="ziti">我爱学习</h1> <div id="woaixuexi" onmouseover="aixuexi();" onmouseout="xuexi();" class="xuexi"></div></body></html>
时间: 2024-08-25 00:51:35