CSS は画像上でマウスを移動する切り替え機能を実現します:
画像上にマウスを置くと他の画像に切り替えることができます。 CSS の使い方を紹介します。この機能を実現するために。
コード例は以下の通りです。
<!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.softwhy.com/" /><head><title>CSS实现的图片切换效果-蚂蚁部落</title><style type="text/css">* { margin:0; padding:0;}ul li { list-style:none;}.nav { width:800px; height:40px; margin:150px auto;}.nav ul li { float:left; width:200px;}.nav ul li a:link, a:visited { display:block; width:190px; height:40px; background:url(images/wall_s1.jpg);}.nav ul li a:hover { background:url(images/wall_s2.jpg);}.nav ul li a:active { background:url(images/wall_s3.jpg);}</style></head><body><div class="nav"> <ul> <li><a href="#"></a></li> <li><a href="#"></a></li> <li><a href="#"></a></li> </ul></div></body></html>上記のコードを実装すると、リンク上にマウスを置くと画像切り替え機能が実現できます。
元のアドレスは次のとおりです: http://www.softwhy.com/forum.php?mod=viewthread&tid=8354
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
