bootstrap五星评分_炫酷纯CSS3星级评分动画特效

starability.css是一款炫酷纯CSS3星级评分动画特效。该特效中共有6种不同的星级评分动画效果，分别是滑动动画，淡入淡出动画，旋转动画，发光动画和复选框动画。

该星级评分特效使用纯HTML和CSS来制作，你甚至可以使用键盘来访问控制评分，屏幕阅读器也能够阅读出当前选择的评分。

需要注意的是，该星级评分特效只是提供了星级的样式和动画，如果你需要后台可以获取用户当前选择的星星数量，还自己需要额外编写一些代码来实现。

使用方法

在页面中引入starability-all.min.css文件，或者你只需要某种动画，可以只引入该动画相应的CSS文件。

HTML结构

使用下面的HTML结构来制作星级评分特效，注意，如果你在一个页面中使用多个评分组件，那么radio按钮的ID号必须不同。

First rating:

5 stars

4 stars

3 stars

2 stars

1 star

Second rating:

5 stars

4 stars

3 stars

2 stars

1 star

CSS样式

各种不同的动画通过在

元素上添加不同的CLASS类来实现。

星星使用图片来制作，在CSS文件中使用相对路径来引用它们，../images/icons.png。你可以使用自己的图片来替代它们。

可用的星级评分动画的CLASS类有：

starability-basic

starability-slot

starability-grow

starability-growRotate

starablity-fade

starability-checkmark

浏览器兼容

该星级评分特效兼容IE10+的所有现代浏览器，如果你需要支持旧版本的IE浏览器，可以使用Modernizr等工具来禁用动画。