只需要用两个图标即可实现：
<htmlxmlns="http://www.w3.org/1999/xhtml"> <head> <metahttp-equiv="Content-Type"content="text/html; charset=utf-8"/> <title>星级评分展示CSS样式技巧</title> <styletype="text/css"> .vote-star{ display:inline-block;/*内联元素转换成块元素，并不换行*/ margin-right:6px; width:75px;/*5个星星的宽度*/ height:15px;/*1个星星的高度*/ overflow:hidden; vertical-align:middle; background:url(../content/images/group/starsblack.png) repeat-x;} .vote-star i{ display:inline-block;/*内联元素转换成块元素，并不换行*/ height:15px;/*1个星星的高度*/ background:url(../content/images/group/starsyellow.png) repeat-x 00;} .vote-number{ vertical-align:middle; font-family:微软雅黑,Verdana,Geneva, sans-serif; font-size:12px;} </style> </head> <body> <divclass="star"> <spanclass="vote-star"><istyle="width:97%"></i></span><spanclass="vote-number">9.7分</span> </div> </body> </html>
原文：http://www.cnblogs.com/cnchenjunbiao/p/4479053.html
