Breadcrumb

Breadcrumb (브레드크럼)

브레드크럼은 페이지의 계층 구조를 보여주는 내비게이션 요소예요. 섹션 사이의 구분자를 아이콘이나 텍스트로 표현해 현재 위치를 쉽게 알려줘요.

출처: 문서

본문

Types (유형)

Breadcrumb (브레드크럼)

표준 브레드크럼이에요.

Home
       / 
      Store
       / 
      T-Shirt

Home
      
      Store
      
      T-Shirt

Content (콘텐츠)

Divider (구분자)

브레드크럼에는 섹션 간의 관계를 보여주는 구분자를 넣을 수 있어요. 구분자는 아이콘이나 텍스트로 표현할 수 있어요.

Home
      /
      Registration
      /
      Personal Information

Home
      
      Registration
      
      Personal Information

Section (섹션)

브레드크럼에는 링크나 텍스트로 표현되는 섹션을 넣을 수 있어요.

Home
       / 
      Search

Link (링크)

섹션은 링크가 될 수도 있고 링크를 포함할 수도 있어요.

Home
       / 
      Search for: paper towels

States (상태)

Active (활성)

섹션은 활성 상태가 될 수 있어요.

Products
       / 
      Paper Towels

Variations (변형)

Inverted (반전)

브레드크럼은 반전(inverted) 스타일로 쓸 수 있어요.

Home
            
            Registration
            
            Personal Information
        
        
        
            Home
            
            Registration
            
            Personal Information

Size (크기)

브레드크럼은 크기를 다양하게 바꿀 수 있어요.

Home
      
      Registration
      
      Personal Information

Home
      
      Registration
      
      Personal Information

Home
      
      Registration
      
      Personal Information

Home
      
      Registration
      
      Personal Information

Home
      
      Registration
      
      Personal Information

Home
      
      Registration
      
      Personal Information

Home
      
      Registration
      
      Personal Information

더 알아보기 (Learn more)

브레드크럼은 사이트의 계층 구조를 사용자에게 보여주는 기본 내비게이션 요소예요. active 섹션으로 현재 페이지를 강조하고, inverted와 크기 변형으로 사이트 느낌에 맞게 다듬어 보세요.