css鼠标悬浮代码定义：
* { margin: 0px; padding: 0px; font-size: 12px; } #pruduce { width: 947px; background-color: #f2f2f2; } .top { height: 55px; background: url(../images/top.jpg) no-repeat 10px 10px; } .main { text-align: center; height: 309px; } .box { width: 300px; height: 285px; border: 1px solid #999; margin: 0px 6px; float: left; cursor: pointer; } dl { padding-top: 3px; } dd { line-height: 30px; } div.btprice_1 { height: 50px; background: #fff2ce url(../images/bt1.jpg) no-repeat 5px 4px; } div.btprice_2 { height: 50px; background: #fff2ce url(../images/bt2.jpg) no-repeat 5px 4px; } div.btprice_3 { height: 50px; background: #fff2ce url(../images/bt3.jpg) no-repeat 5px 4px; } .hoverstyle { background-color: #d51938; color: #fff; } .hide { background-color: white; color: black; } jQuery将css引入3中鼠标悬浮事件：
$(function () { $(".box").on("mouseover", function () { $(this).addClass("hoverstyle"); }); $(".box").on("mouseout", function () { $(this).removeClass("hoverstyle"); }); });