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 ::before
agus 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-divider
gu 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 .