<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
.changeColor2Pink{
background-color: pink
}
.resetBtn1Color{
background: none
}
</style>
<script type="text/javascript">
window.onload = function () {
var btn1=document.getElementById("btn1")
var btn2= document.getElementById("btn2")
btn1.onclick = function () {
btn1.className="changeColor2Pink"
}
btn2.onclick = function () {
btn1.className = "resetBtn1Color"
btn2.className = "changeColor2Pink"
}
}
</script>
</head>
<body>
<button id="btn1">按钮1</button>
<button id="btn2">按钮2</button>
</body>
</html>
需要准备的材料分别有：电脑、浏览器、html编辑器。
1、首先，打开html编辑器，新建html文件，例如：index.html。
2、在index.html中的<style>标签中，输入css代码：
a{color: black}
a:hover{color: red}
a:visited{color: red}
3、浏览器运行index.html页面，此时黑色的超链接被移入和点击后是红色的。
<input id="btn" type="button" value="点击按钮" /><script language="javascript" src="Scripts/jquery-1.4.1.min.js"></script>
<script language="javascript">
$(function () {
$("#btn").hover(function () { $(this).css("background-color", "Yellow")}, function () { $(this).css("background-color", "red")})
$("#btn").click(function () {
$(this).css("background-color", "Gray")
})
})
</script>
