htmlのタブの色変更について

質問

タブのボックスの色を変えたいと考えています。

http://archiva.jp/test/html/tab-menu.htmlのソースのようなタブの作り方で，
page5のタブのボックスを白色から赤色に変えたい場合、ソースのどの部分を変更すればよろしいでしょうか？
できれば具体的にお願いします。

ご存じの方いらっしゃいましたら、よろしくお願いしいたします。

回答No.1

torayoshi · ベストアンサー

質問文そのままだと、他のどのタブが開いていても
常にpage5だけ赤色になりますけどそれでも良いんですか？

【常にpage5だけ赤】（見づらいので文字だけ白）
<li><a href="#page5" style="background-color:#ff0000;color:#fff;">Page_5</a></li>

【（おまけ）開かれてるタブだけ赤】（見づらいので文字だけ白）
#tab li a:hover,
#tab li.present a {
border-color: #333;
color: #000;
}
↑の部分を↓
#tab li a:hover {
border-color: #333;color:#000;
}
#tab li.present a {
border-color: #333;
color: #fff;background-color:#ff0000;
}
に変更。

お礼

ご丁寧な解答ありがとうございます！！
思うとおりにすることができました。

ちにみにですが、下記の条件を満たすものを作成するのは可能なのでしょうか？

page5のタブは常に青で表示され、選択されたタブは赤で表示される。
page5のタブが選択された場合は、page5のタブが青ではなく赤で表示される