滑块Slider
你可能会说
价格范围想用一根可以拖着走的滑杆来调。
滑块是沿着一段连续或分级范围调整数值的表单控件音量、亮度和价格区间可用滑块调整。应显示范围、当前值并支持键盘操作；需要精确输入 50 等具体数值时，还要提供 数字输入框 Number Input。
组成结构 · Anatomy
60
整段可选范围
显示当前已选范围
可拖动，悬停时放大
拖动时实时跟着变
常见变体 · Variants
默认Default
音量、亮度等连续量的调节
双滑块区间Range
要框定起止范围，比如价格带
带刻度With Marks
050100
帮用户对齐几个关键档位
禁用Disabled
该调节项当前不可用
典型使用场景
音量亮度调节
价格区间筛选
价格区间¥100 — ¥300
¥0¥500
已筛选出 86 件商品
图片缩放
缩放80%
10%200%
AI 创作强度
🤖 AI 写作设置
延伸阅读 · 权威出处