Badge배지
배지는 개수나 상태 표시와 같은 동적 정보를 표시할 때 사용합니다. 텍스트나 숫자를 포함할 수 있습니다.
사용법
컴포넌트 가져오기:
import 'mdui/components/badge.js';
컴포넌트의 TypeScript 타입 가져오기:
import type { Badge } from 'mdui/components/badge.js';
사용 예시:
<mdui-badge>12</mdui-badge>예시
형태
variant 속성을 사용해 배지의 형태를 설정합니다. variant가 large일 때는 대형 배지가 표시됩니다. default 슬롯에 표시할 텍스트를 지정할 수 있습니다.
API
CSS 사용자 정의 속성
| 이름 |
|---|
--shape-corner |
컴포넌트의 둥근 모서리 크기입니다. 구체적인 픽셀 값을 지정할 수 있지만, 디자인 토큰을 참조하는 것을 권장합니다. |
이 페이지의 목차