css背景3
<head> <meta charset="UTF-8"> <title>练习三</title> <style type="text/css"> .box4{ width: 223px; height: 195px; /*background-color: yellow;*/ background-image: url(img/bg2.png); background-position:0px 0px; } .box4:hover{ background-position: 0px -200px; } .box1{ width: 195px; height: 195px; background-image: url(img/bg2.png); background-position: -222px 0px; } .box1:hover{ background-position: -222px -201px; } .box2{ width: 205px; height: 200px; background-image: url(img/bg2.png); background-position: -415px 0px; } .box2:hover{ background-position: -415px 197px; } .box3{ width: 200px; height: 200px; background-image: url(img/bg2.png); background-position: -616px 0px; } .box3:hover{ background-position: -616px -195px; } </style> </head> <body> <div class="box4"></div> <div class="box1"></div> <div class="box2"></div> <div class="box3"></div> </body> </html>