[CSS]リスト要素で実装したサイトマップを美しくスタイルする -SlickMap CSS

実用的で美しいサイトマップを実装するスタイルシートをAstuteoから紹介します。

SlickMap CSS
demo

サイトマップの階層はレベル3まで用意されており、リスト要素でシンプルに実装されています。

スタイルシートのオフ時

SlickMap CSSの使い方

添付の「README.txt」より、SlickMap CSSの簡単な使い方です。

1. ul要素で実装し、各ラベルには必ずa要素を含めます。
   フォーマットはデモまたはダウンロードのファイルを確認してください。
2. スタイルシートのmediaには「screen, print」を指定しています。
3. サイトマップの一番上に配置されるサイトのトップページへのリンクは、リストの一番上に記述し、idを「#home」にします。
4. カラムの幅を変えるには、「slickmap.css」内の「#primaryNav li」のwidth指定を変更します。
5. ファイルの設置場所に合わせて、画像のパスなどは変更してください。