[使える CSS テクニック]CSSだけで実現するタブナビゲーション | バシャログ。第 3 回目は「タブナビゲーションを CSS で実現してみよう」です。 タブナビゲーションはサイトのメニューに多く使われ、ビジターに「ここはクリックできますよ」とわかりやすく伝えるためにロールオーバすることが多いです。 ロールオーバに JavaScript を使用する方法もありますが、CSS ならもっとスッキリ！ 1.テキストリンクを生かしてタブナビゲーションを実現してみる テキストリンクを生かしたまま、背景に画像を表示させることでナビゲーションに見せる方法です。 [サンプル] [HTML] ソースはこんな感じになります。 <div id="tabnav-00"> <ul> <li id="menu01"><a href="#">メニュー01</a></li> <li id="menu02"><a href="#">メニュー02</a></li> <li id="menu03"><a hr
![[使える CSS テクニック]CSSだけで実現するタブナビゲーション | バシャログ。](https://cdn-ak-scissors.b.st-hatena.com/image/square/1f4390ea5b2b558adfd9c349b9a080aae407daff/height=288;version=1;width=512/https%3A%2F%2Fbashalog.c-brains.jp%2Fshared%2Fpublic%2Fimg%2Fcommon%2Ficon_ogp02.png)
