デザインの勉強にもなる、CSSで実装するパンくずのまとめ

角丸や三角形、アイコンなどを添えたり、CSS3アニメーションを加えたりなど、CSSで実装するパンくずを紹介します。

機能的にはもちろんシンプルなテキストベースのものと同じですが、サイトのUIにあったデザインのパンくずも素敵ですよね。

デモのキャプチャ

Breadcrumb

デモのキャプチャ

Tiny CSS3 Round Breadcrumb

デモのキャプチャ

Flat CSS3 Breadcrumb

デモのキャプチャ

Pure CSS3 Breadcrumb Navigation

デモのキャプチャ

Graceful Breadcrumb Navigation Menu In CSS3

デモのキャプチャ

Breadcrumb Navigation with CSS Triangles

デモのキャプチャ

CSS3 Breadcrumbs

デモのキャプチャ

Flat Style Breadcrumb Links with CSS

デモのキャプチャ

Nice Scalable CSS Based Breadcrumbs

デモのキャプチャ

Five CSS3 Breadcrumb

top of page

©2017 coliss