组件 · 表单 · 原生 HTML 与 React

复选 Checkbox

多选、或需要确认后才生效的单个选项；支持半选。

演示

智能标点

<label class="xxd-choice"><input type="checkbox" class="xxd-check" checked>智能标点</label>

export function CheckboxDemo() {
  const [on, setOn] = useState(true);
  return <Checkbox label="智能标点" checked={on} onCheckedChange={setOn} />;
}

同一个元素的各种状态并排。悬停、聚焦、按下用的是组件 CSS 里真实的规则（构建时复制成强制状态），不是手画的。