スタイルシートでタブメニュー

　スタイルシートを使った、タブメニューです。
　このタブメニューは、IE8, IE7, IE6, Firefox3, Safari4, Opera10, Sleipnir2で動作することを確認済みです。

　上記のタブメニューを利用するには、下記のようにヘッダを記述します。
　IE6に対応する場合、IEのW3C標準仕様対応ライブラリ（Google Code）を利用する必要があります。

<link rel="stylesheet" type="text/css" href="tabmenu.css" />

　タブメニューは、下記の例のようにHTMLを記述します。
　ulタグに、tabmenuクラスを指定するだけで、利用できます。 カレントタブには、actクラスを指定する必要があります。
　タブメニューは、可変長の文字列にも、対応しています。
　スタイルシートの著作権は放棄していませんが、そのまま利用したり、カスタマイズして利用することは、自由に行って頂いて構いません。

<!-- ↓タブメニュー↓ -->
<ul class="tabmenu">
<li class="act"><a href="#">TOP</a></li>
<li><a href="#">メニュー1</a></li>
<li><a href="#">メニュー2</a></li>
<li><a href="#">メニュー3</a></li>
</ul>
<!-- ↑タブメニュー↑ -->

<!-- ↓タブ内容↓ -->
<div class="tabbody">

</div>
<!-- ↑タブ内容↑ -->

　カスタマイズする場合は、下記のファイルをダウンロードし、tabmenu.cssの内容を変更してください。
　プロパティの値を変更することで、色の変更や、大きさの変更などが可能です。
　また、backgroundプロパティに、画像ファイルを指定することで、見栄えの良いメニューにすることもできます。 画像を変更する場合は、カレント時（act）の画像と、非カレント時（inact）の画像と、マウスオーバー時（sel）の画像を3枚作成します。 幅は400ドットで作成していますが、文字列の長さによって、自動的に短く表示されます。 そのため、中心部は繰り返し模様にする必要があります。 繰り返し模様にできない場合は、ボタンサイズを固定長にカスタマイズしてください。
　スタイルシートは、プロパティの並び順の変更や、プロパティの追加を行うと、デザインが崩れる可能性がありますので、注意してください。