パンくずナビゲーション
パンくず（Breadcrumb）ナビゲーションは、来た道をたどって開始ページまで戻ることができるパンくずリストを提供することによって、ユーザーがウェブサイト内の自分の位置を理解するのに役立ちます。
要件
項目は通常、個々のページ間の階層を示すために、区切り文字を付けてインラインで表示されます。
レシピ
行った選択
このパターンは単純なフレックスレイアウトを使用してレイアウトされており、CSS の1行でナビゲーションがどのように行われるかを示しています。 区切り文字は CSS 生成コンテンツを使用して追加されます。 区切り文字は好きなものに変更することができます。
アクセシビリティへの懸念
aria-label 属性および aria-current 属性を使用して、このナビゲーションが何であるか、そして現在のページが構造のどこにあるのかをユーザーが理解できるようにしています。 詳細については関連リンクを参照してください。
ブラウザー実装状況
BCD tables only load in the browser
さまざまなレイアウト方法が異なるブラウザーサポートを持っています。 使用されているプロパティの基本的なサポートの詳細については、以下の表を参照してください。