[CSS]Vista風ナビゲーションのチュートリアル

Tutorial Zoneで、Vista風ナビゲーションをCSSで(JavaScript無しで)実装するチュートリアルが掲載されていました。
テキスト箇所はテキストデータで作成しているため、テキストを変更したり、また背景画像・アイコンを変更したりと応用可能なチュートリアルになっています。

Vista風ナビゲーションのキャプチャ

Creating a vista style nav bar in css

ナビゲーションの各項目は、リストで記述されています。
また、マウスのホバー時の画像変更は、背景画像の変更で、オーソドックスな実装方法となっています。

デモページ

使用している画像は、下記の8枚の画像からなっています。

Vista風ナビゲーションで使用されている画像

sponsors

top of page

©2018 coliss