બ્રેડક્રમ્બ
નેવિગેશનલ હાયરાર્કીમાં વર્તમાન પૃષ્ઠનું સ્થાન સૂચવો જે CSS દ્વારા આપમેળે વિભાજકોને ઉમેરે છે.
વિભાજકો આપમેળે CSS માં ::before
અને દ્વારા ઉમેરવામાં આવે છે content
.
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item active" aria-current="page">Home</li>
</ol>
</nav>
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item active" aria-current="page">Library</li>
</ol>
</nav>
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item"><a href="#">Library</a></li>
<li class="breadcrumb-item active" aria-current="page">Data</li>
</ol>
</nav>
કારણ કે બ્રેડક્રમ્સ નેવિગેશન પ્રદાન કરે છે, તે અર્થપૂર્ણ લેબલ ઉમેરવાનો સારો વિચાર છે જેમ કે તત્વમાં aria-label="breadcrumb"
આપેલા નેવિગેશનના પ્રકારનું વર્ણન કરવા <nav>
, તેમજ aria-current="page"
તે વર્તમાન પૃષ્ઠને રજૂ કરે છે તે દર્શાવવા માટે સેટની છેલ્લી આઇટમ પર લાગુ કરવું.
વધુ માહિતી માટે, બ્રેડક્રમ્બ પેટર્ન માટે WAI-ARIA ઓથરિંગ પ્રેક્ટિસ જુઓ .