</p> <style> <p>/* styles for the star rater */</p> <p>.star-rating{</p> <p> list-style:none;</p> <p> margin: 3px;</p> <p> padding:0px;</p> <p> width: 100px;</p> <p> height: 20px;</p> <p> position: relative;</p> <p> background: url(http://komodomedia.com/blog/samples/star_rating.gif) top left repeat-x; </p> <p>}</p> <p>.star-rating li{</p> <p> padding:0px;</p> <p> margin:0px;</p> <p> /**/</p> <p> float: left;</p> <p> /* */</p> <p>}</p> <p>.star-rating li a{</p> <p> display:block;</p> <p> width:20px;</p> <p> height: 20px;</p> <p> text-decoration: none;</p> <p> text-indent: -9000px;</p> <p> z-index: 20;</p> <p> position: absolute;</p> <p> padding: 0px;</p> <p> background-image:none;</p> <p>}</p> <p>.star-rating li a:hover{</p> <p> background: url(http://komodomedia.com/blog/samples/star_rating.gif) 0px -20px repeat-x;</p> <p> z-index: 1;</p> <p> left: 0px;</p> <p>}</p> <p>.star-rating a.one-star{</p> <p> left: 0px;</p> <p>}</p> <p>.star-rating a.one-star:hover{</p> <p> width:20px;</p> <p>}</p> <p>.star-rating a.two-stars{</p> <p> left:20px;</p> <p>}</p> <p>.star-rating a.two-stars:hover{</p> <p> width: 40px;</p> <p>}</p> <p>.star-rating a.three-stars:hover{</p> <p> width: 60px;</p> <p>}</p> <p>.star-rating a.three-stars{</p> <p> left: 40px;</p> <p>}</p> <p>.star-rating a.four-stars{</p> <p> left: 60px;</p> <p>} </p> <p>.star-rating a.four-stars:hover{</p> <p> width: 80px;</p> <p>}</p> <p>.star-rating a.five-stars{</p> <p> left: 80px;</p> <p>}</p> <p>.star-rating a.five-stars:hover{</p> <p> width: 100px;</p> <p>} </p> </style> <ul class='star-rating'> <li><a href='#' title='Rate this 1 star out of 5' class='one-star'>1</a></li> <li><a href='#' title='Rate this 2 stars out of 5' class='two-stars'>2</a></li> <li><a href='#' title='Rate this 3 stars out of 5' class='three-stars'>3</a></li> <li><a href='#' title='Rate this 4 stars out of 5' class='four-stars'>4</a></li> <li><a href='#' title='Rate this 5 stars out of 5' class='five-stars'>5</a></li> </ul> <p> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

from:

http://komodomedia.com/blog/index.php/2005/08/24/creating-a-star-rater-using-css/