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&eacute;sum&eacute;</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

Popular posts from this blog

Delphi change the assembly code of a running process -

json - Hibernate and Jackson (java.lang.IllegalStateException: Cannot call sendError() after the response has been committed) -

C++ 11 "class" keyword -