怎么用纯css写的评分鼠标移入的效果

tangjin

作者

这篇文章主要讲解了“怎么用纯css写的评分鼠标移入的效果”，文中的讲解内容简单清晰，易于学习与理解，下面请大家跟着小编的思路慢慢深入，一起来研究和学习“怎么用纯css写的评分鼠标移入的效果”吧！

代码如下:

<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"xml:lang="en"><head><metahttp-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://images.cnitblog.com/blog/294743/201304/21141707-77236dc5976d4f7db624bf3a5d2eee28.gif);background-repeat:no-repeat;background-position:0-3px;}spanspanspanspanspan{padding-left:0;}span:hover{background-position:0-31px;}</style><span><span><span><span><span></span></span></span></span></span></body></html>

效果如下