Abolomegba

Fia afi si axa si li fifia le le mɔfiamewo ƒe ɖoɖo aɖe si tsɔa mamãnuwo kpena ɖe eŋu le eɖokui si to CSS dzi la me.

Kpɔɖeŋu

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

Trɔtrɔ ɖe mamanu la ŋu

Wotsɔa mamalawo kpena ɖe wo nɔewo ŋu le CSS me to ::beforekple content. Woate ŋu atrɔ wo to tɔtrɔ $breadcrumb-dividerme . Nyayɔyɔ ƒe dɔwɔwɔ hiã be woawɔ nyayɔyɔ siwo ƒo xlã ka aɖe, eyata ne èdi >abe mama ene la, àteŋu azã esia:

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

Ateŋu adzɔ hã be woazã base64 embedded SVG dzesi :

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

Woateŋu aɖe mamanu la ɖa to ɖoɖowɔwɔ $breadcrumb-dividerɖe none:

$breadcrumb-divider: none;

Mɔnukpɔkpɔwo ƒe Mɔnukpɔkpɔ

Esi wònye be abolomegbawo naa mɔfiame ta la, anyo be nàtsɔ dzesideŋkɔ si ŋu gɔmesese le akpe ɖe eŋu abe alesi aria-label="breadcrumb"nàɖɔ mɔfiame ƒomevi si wona le <nav>element la me ene, eye nàzã an aria-current="page"ɖe nu mamlɛtɔ si le ƒuƒoƒoa me ŋu atsɔ afia be etsi tre ɖi na axa si li fifia.

Ne èdi nyatakaka bubuwo la, kpɔ ARIA ƒe Agbalẽŋɔŋlɔ ƒe Nuwɔnawo Ŋuti Mɔfiamegbalẽa abolomegba ƒe nɔnɔme .