Label

컨트롤과 연결된 접근 가능한 라벨을 렌더링합니다.

Docs API Reference

이용 약관에 동의합니다

<script lang="ts">
  import { Checkbox } from "$lib/components/ui/checkbox/index.js";
  import { Label } from "$lib/components/ui/label/index.js";
</script>
 
<div>
  <div class="flex items-center space-x-2">
    <Checkbox id="terms" />
    <Label for="terms">이용 약관에 동의합니다</Label>
  </div>
</div>

설치

pnpm dlx shadcn-svelte@latest add label

npx shadcn-svelte@latest add label

npx shadcn-svelte@latest add label

bun x shadcn-svelte@latest add label

Install bits-ui:

pnpm i bits-ui -D

npm i bits-ui -D

yarn install bits-ui -D

bun install bits-ui -D

다음 코드를 프로젝트에 복사하여 붙여넣으세요.

import Root from "./label.svelte";

export {
  Root,
  //
  Root as Label,
};

사용법

<script lang="ts">
  import { Label } from "$lib/components/ui/label/index.js";
</script>

<Label for="email">이메일 주소</Label>

Kbd Menubar