[CSS]三角形で繋がったパンくずのナビゲーションを実装するスタイルシートのテクニックまとめサイトのパンくずやフォームのステップでよく見かける、ブロックに三角形の山形を隣接させたリンクの列をCSSで実装するテクニックを紹介します。 CSSでの実装方法はいろいろあり、またCSSでシャドウやグラデーションを適用したバリエーションの実装方法も解説します。 Oh, the Many Ways to Make Triangular Breadcrumb Ribbons! 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 三角形を使ったパンくずのナビゲーション HTMLの構造 CSS: ベースのスタイル CSS: 三角形の実装方法 オプションのバリエーション 他に検討すべき点 三角形を使ったパンくずのナビゲーション 階層を表示したパンくずのナビゲーションで見かける、各ブロックに三角形の山形を持つ隣接するリンクの列を作成する方法を見て
![[CSS]三角形で繋がったパンくずのナビゲーションを実装するスタイルシートのテクニックまとめ](https://cdn-ak-scissors.b.st-hatena.com/image/square/8181f165a4130a8445a88ef3ac4f80ca8d234b15/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201902%2F2019050901.png)
