用CSS实现一个星级评定的效果
2009/06/18 18:29 | 分类：Css
开篇的时候总是在想，这个叫星级评定到底贴切不贴切，总之大家知道是这么个效果就好了。大家先看一下截图吧
1. 定义一个UL列表（当然如果你喜欢可以使用其他标签）
2. 设定每个LI项目为为display:inline，然他们单行显示,然后每个LI下的A设置背景，默认为未加亮星星，本例里图片的宽度 是 30像素，所以这个宽度要和图片宽度是一致的。
3. 给每个A设置鼠标请过效果。
4. 大家可以看到UL使用到了相对定位，目的就是要设定一个标签让他有已经评分后加亮星星的效果，这一步也是整个实现过程的灵魂，前面我们说过，每个图片是30像素的宽度，所以这里设定的宽度当然是以30为递增的。一个就是30像素，2个是60像素，以此类推。
5. 如果要实现半个加亮星星的效果，只需要设置宽度为30的一半即可。
全文阅读 »
