みなさんこんにちは、gazzaです。

最近寒くなってきました、鍋やおでんがおいしい季節ですね!

今回はCSS3のプロパティについてお話します。

jsを使わずにCSSのみでタブのメニューを作れないかというお題があり、それ関連でCSS3に関して調べていたら出てきたのがセレクターの「:target」です。

簡単に言うとcssでターゲット指定をしたIDに対してアンカーリンクをするとそのCSSが適用されるというものです。
これで解決するかと思っていたのですが幾つか問題点がありました。

・display:none等で作成すると初期の状態が非表示になってしまう。
・position:absoluteとopacityで作成すると高さの可変に対応できない。
・アンカーリンクの為、ページ遷移をしてしまう。

結論としては現状JS抜きの物の完全な代替にははならないようですね・・・

ただその他の使い方なども色々ありそうなので面白い物が見つかったらまたご紹介させて頂きます。