<nav aria-label="breadcrumb">
  <ul>
    <li class="breadcrumb-item"><a href="#">Home</a></li>
    <li class="breadcrumb-item"><a href="#">Subpage</a></li>
    <li class="breadcrumb-item active" aria-current="page">Detail</li>
  </ul>
</nav>
ul {
  display: flex;
  list-style: none;
  gap: 6px;
}

ul > li:not(:first-child)::before {
    float: left;
    color: gray;
    padding-right: 4px;
    content: "/";
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.