前端

评分Rate

你可能会说

想让用户给商品打个分,用星星就行。

评分控件是让用户在有顺序的等级中选择评价分值的表单控件商品评价常用五颗星表示满意程度,并应同时显示“4 分”等可读文字。星数、是否允许半分必须与实际评价规则一致。
半星 · 3.5 4.8只读展示
组成结构 · Anatomy
4 分 · 满意
通常五颗,数量和图标都可换
实心已选、空心未选,支持半颗
分值和对应感受,如“4 分 · 满意”
常见变体 · Variants
默认Default
五星制打分,表达几分满意
半星Half Star
3.5
想要更细的分数粒度时
只读展示Readonly
4.8
展示综合评分,不让用户改
自定义图标Custom Icon
想要品牌感,用爱心等图形替换星星
典型使用场景
电商订单评价
无线蓝牙耳机
交易成功 · 7 月 18 日
商品评价 满意
课程内容评分
前端入门 · HTML 第一课
4.8
评分样本量与统计口径
“步骤和前置知识说明得很清楚” —— 评价示例
客服满意度
本次服务满意吗?
客服小蜜 · 会话已结束
非常满意
餐厅打卡评分
山丘咖啡 · 南山店 3.5
点评摘要与样本量应标注来源