Breac-bhràghad

Sònraich far a bheil an duilleag làithreach taobh a-staigh rangachd seòlaidh a chuireas gu fèin-obrachail dealadairean tro CSS.

eisimpleir

<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>

Ag atharrachadh an dealaiche

Bithear a’ cur dealadairean gu fèin-ghluasadach ann an CSS tro ::beforeagus content. Faodar an atharrachadh le bhith ag atharrachadh $breadcrumb-divider. Tha feum air a’ ghnìomh cuòt gus na luachan a ghineadh timcheall air sreang, mar sin ma tha thu ag iarraidh >mar neach-sgaraidh, faodaidh tu seo a chleachdadh:

$breadcrumb-divider: quote(">");

Tha e comasach cuideachd ìomhaigh SVG freumhaichte base64 a chleachdadh :

$breadcrumb-divider: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4IiBoZWlnaHQ9IjgiPjxwYXRoIGQ9Ik0yLjUgMEwxIDEuNSAzLjUgNCAxIDYuNSAyLjUgOGw0LTQtNC00eiIgZmlsbD0iY3VycmVudENvbG9yIi8+PC9zdmc+);

Faodar an dealaiche a thoirt air falbh le bhith a’ suidheachadh $breadcrumb-dividergu none:

$breadcrumb-divider: none;

Ruigsinneachd

Leis gu bheil crùbanan arain a’ toirt seachad seòladh, is e deagh bheachd a th’ ann bileag brìoghmhor a chuir ris leithid aria-label="breadcrumb"cunntas a thoirt air an t-seòrsa seòlaidh a tha air a sholarachadh san <nav>eileamaid, a bharrachd air a bhith a’ cur an sàs anns aria-current="page"an rud mu dheireadh den t-seata gus sealltainn gu bheil e a’ riochdachadh na duilleige gnàthach.

Airson tuilleadh fiosrachaidh, faic pàtran crùbagan arain Stiùireadh Cleachdaidhean Ùghdarrachaidh ARIA .