Navigation
Breadcrumb
semantic HTML현재 위치와 상위 문서 경로를 의미론적 탐색 링크로 표시합니다.
Live example
<nav data-standard-component="breadcrumb" aria-label="Breadcrumb"><ol><li><a href="#home">Home</a></li><li><a href="#components">Components</a></li><li aria-current="page">Breadcrumb</li></ol></nav>Variants and sizes
The pattern inherits theme and density tokens. Use compact, comfortable, or roomy density when the surrounding screen requires it.
compactcomfortableroomy
Public API
| Contract | Value |
|---|---|
| Implementation | semantic HTML |
| Status | stable |
| License | free |
| Since | 0.5 |
| HTML contract | Native HTML elements and attributes |
| Events | Native browser events |
Accessibility
nav landmark, ordered list, current page, keyboard reachable links
Server template guidance
<!-- Render the semantic HTML on the server. Load enhancement JavaScript only when this interaction is needed. -->