:target 疑似クラスを使って、JavaScript は一切使用せず CSS だけでタブ切替のユーザインタフェースを実装してみます。 タブ切替の UI は、よく使われますが、JavaScript で実装するケースが多いので、今回は全部 CSS のみで実装してみるテスト。目新しいことをやっているわけではありませんので、すでにやられている方もいるかもしれませんが気にせずいきます。 使うのは :target 疑似クラスで、IE9 以降は対応していますので、比較的動作環境も広いし、フラグメント識別子つきのリンク (要するに #hoge がついたリンクです) で、各タブを直接指定したリンクが簡単に張れるので、JavaScript でやるより楽に使い勝手のよいタブ切替が実装できる場合もあります。 実際のサンプルは下記に。 CSS だけで作るタブ切替ユーザインタフェース サンプル 最新の Firef