45fan.com - 路饭网

搜索: 您的位置主页 > 电脑频道 > 编程代码 > 阅读资讯:用css样式打造鼠标移动评分效果的代码

用css样式打造鼠标移动评分效果的代码

2015-03-04 08:11:17 来源:www.45fan.com 【
用css样式打造鼠标移动评分效果的代码

需要用到的背景图片(右击保存):


复制代码 代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>Document</title>
</head>
<body>
<style>
* {
margin: 0;
padding: 0;
}
span {
display: block;
width: 30px;
height: 30px;
padding-left: 30px;
background-image: url(http://www.45fan.com/uploads/allimg/150215/5342-1502151P053256.gif);
background-repeat: no-repeat;
background-position: 0 -3px;
}
span span span span span {
padding-left: 0;
}
span:hover {
background-position: 0 -31px;
}
</style>
<span>
<span>
<span>
<span>
<span></span>
</span>
</span>
</span>
</span>
</body>
</html>

效果如下

本文地址:http://www.45fan.com/bcdm/9830.html
Tags: css
编辑:路饭网
推广内容
推荐阅读
热门推荐
推荐文章
关于我们 | 联系我们 | 友情链接 | 网站地图 | Sitemap | App | 返回顶部