<!DOCTYPE html>
<html>
<body>
<style type="text/css">
.testNormal {
border:1px solid black;
}
.testOver {
background:#999999;
border:1px solid black;
font-weight:bold;
padding:3em;
}
</style>
<script>
function over(){
var para = document.getElementById("testPara").className = "testOver";
}
function out(){
var para = document.getElementById("testPara").className = "testNormal";
}
</script>
<p id="testPara" class="testNormal" οnmοuseοver="over()" οnmοuseοut="out()">
我是示例段落,鼠标滑过我,就可以改变我的class属性,从而改变应用的CSS规则。 </p>
</body>
</html>
鼠标移动之前的效果
鼠标移动之后的效果