Rating 设计文档

评分组件(对齐 Semi):支持半星、hover 预览、点击清零与键盘操作;每颗星为 role=radio 双层(roving tabindex),额外空评分项承载 0 分焦点。

← API 文档

使用建议

评分组件(对齐 Semi):支持半星、hover 预览、点击清零与键盘操作;每颗星为 role=radio 双层(roving tabindex),额外空评分项承载 0 分焦点。

Accessibility

ARIA role:radio

  • 每颗星两个 role=radio(first 半星 / second 整星)+ roving tabindex(对齐 Semi)
  • 额外渲染 index==count 的空评分项,承载 0 分焦点/停靠点
  • 方向键增减分值(RTL 镜像),越界环绕(>count→0,<0→count)
  • hover 预览为纯本地状态,不影响受控值;移出回调 undefined
  • allowHalf 时按指针落在星左/右半决定 .5

设计变量

变量
默认值
用法
--cd-transform-scale-rating var(--cd-motion-scale-none) 评分-变大(Semi transform_scale-rating)
--cd-transition-delay-rating-color var(--cd-motion-delay-none) 评分-背景色-延迟时间(Semi transition_delay-none)
--cd-transition-duration-rating-color var(--cd-motion-duration-none) 评分-背景色-动画持续时间(Semi transition_duration-none)
--cd-transition-function-rating-color var(--cd-motion-ease-in) 评分-背景色-过渡曲线(Semi transition_function-easeIn)
显示第 1 条-第 4 条,共 4 条
  • 1