Breadcrumb
Ipaila ang lokasyon sa kasamtangan nga panid sulod sa usa ka hierarchy sa nabigasyon nga awtomatiko nga nagdugang mga separator pinaagi sa CSS.
Ang mga separator awtomatikong idugang sa CSS pinaagi sa ::before
ug content
. Mahimo silang mausab pinaagi sa pagbag-o $breadcrumb-divider
. Ang quote function gikinahanglan aron makamugna ang mga quotes sa palibot sa usa ka string, busa kung gusto nimo >
isip seperator, mahimo nimo kining gamiton:
$breadcrumb-divider: quote(">");
Posible usab nga mogamit usa ka base64 nga naka-embed nga SVG icon :
$breadcrumb-divider: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4IiBoZWlnaHQ9IjgiPjxwYXRoIGQ9Ik0yLjUgMEwxIDEuNSAzLjUgNCAxIDYuNSAyLjUgOGw0LTQtNC00eiIgZmlsbD0iY3VycmVudENvbG9yIi8+PC9zdmc+);
Ang separator mahimong tangtangon pinaagi sa pag-set $breadcrumb-divider
sa none
:
$breadcrumb-divider: none;
Tungod kay ang mga breadcrumb naghatag ug nabigasyon, maayo nga ideya nga magdugang ug makahuluganong label sama aria-label="breadcrumb"
sa paghubit sa matang sa nabigasyon nga gihatag sa <nav>
elemento, ingon man sa paggamit ug aria-current="page"
sa kataposang butang sa set aron ipakita nga kini nagrepresentar sa kasamtangang panid.
Para sa dugang nga impormasyon, tan-awa ang WAI-ARIA Authoring Practices para sa pattern sa breadcrumb .