css精灵和hover伪类的联合使用

来源:互联网 发布:网络语偷猪是什么意思 编辑:程序博客网 时间:2024/05/22 03:48

效果如下:

鼠标 放上前:               

鼠标放上后:

代码如下:

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title>    <style type="text/css">        .sun{            width: 200px;            height: 274px;            background: url("img/timg.jpg") no-repeat;        }        .sun:hover{            background: url("img/timg.jpg") no-repeat -200px;        }    </style></head><body><div class="sun"></div></body></html>


0 0