html - How to change the link color of the current page with CSS -
html - How to change the link color of the current page with CSS -
how display link current page different others? swap colors of text , background.
this have:
the html:
<div id="header"> <ul id="navigation"> <li class="bio"><a href="http://www.jacurren.com/">home</a></li> <li class="theatre"><a href="http://www.jacurren.com/theatre.php">theatre</a></li> <li class="prog"><a href="http://www.jacurren.com/programming.php">programming</a></li> <li class="resume"><a href="http://www.jacurren.com/resume.php">résumé</a></li> <li class="portf"><a href="http://www.jacurren.com/portfolio.php">portfolio</a></li> <li class="contact"><a href="http://www.jacurren.com/contact.php">contact</a></li> </ul> </div>
the css:
#navigation{ margin:0; padding:0; background:#000000; height:34px; list-style:none; position: relative; top: 80px; } #navigation li{ float:left; clear:none; list-style:none; } #navigation li a{ color:#a60500; display:block; font-size:12px; text-decoration:none; font-weight:bold; padding:10px 18px; } #navigation li a:hover{ color:#640200; background-color:#000000; }
a:active
: when click on link , hold (active!). a:visited
: when link has been visited.
if want link corresponding current page highlighted, can define specific style link -
.currentlink { color: #640200; background-color: #000000; }
add new class corresponding li
(link), either on server-side or on client-side (using javascript).
html css navigation
Comments
Post a Comment