ふつうタブをつかったコンテンツの切り替え動作をつくるときJavaScriptを使うかjQueryライブラリで実装するのが一般的なのですが、今回はJSを使わずCSSのみで作ったタブコンテンツのサンプルを紹介します。 CSSだけでつくったのでJavaScriptを無効にしたブラウザでも閲覧できて、実装も簡単なので便利だと思います。 デモ サンプルファイルをダウンロードする デモでは5種類のアニメーションを用意しています。 まずはHTMLのソースから。 <ul class=”tabs”> <li> <input type=”radio” checked name=”tabs” id=”tab1″> <label for=”tab1″>tab 1</label> <div id=”tab-content1″ class=”tab-content”> <div class=”animated fad