css - Highlight selected tab in menu -

css - Highlight selected tab in menu -

i have next tabbed navigation setup in master page:

<div id="header"> <div id="logo"> <a href="../default.aspx">logo</a> </div> <div id="menu"> <div class="buttons"> <ul> <li><a href="../default.aspx">home</a></li> <li><a href="../books/books.aspx">books</a></li> <li><a href="../contacts/aboutus.aspx">about us</a></li> <li><a href="../contacts/contact.aspx">contact us</a></li> </ul> </div> </div> </div>

for illustration when click home tab, i'd remain highlighted (ex. background-color: #1087a4;). recommended way accomplish this? , have implemented in master page?

giveid, runat="server" each link. , find link content page , give style on there.

for example:

master page <div id="header"> <div id="logo"> <a href="../default.aspx">logo</a> </div> <div id="menu"> <div class="buttons"> <ul> <li><a id="lbtnhome" runat="server" href="../default.aspx">home</a></li> <li><a id="lbtnbooks" runat="server" href="../books/books.aspx">books</a></li> <li><a id="lbtnabout" runat="server" href="../contacts/aboutus.aspx">about us</a></li> <li><a id="lbtncontact" runat="server" href="../contacts/contact.aspx">contact us</a></li> </ul> </div> </div> </div> home page <script type="text/javascript"> var link = document.getelementbyid('<%=master.findcontrol("lbtnhome").clientid %>'); link.style.color = '#1087a4'; </script> books page <script type="text/javascript"> var link = document.getelementbyid('<%=master.findcontrol("lbtnbooks").clientid %>'); link.style.color = '#1087a4'; </script>

like same other pages.

css asp.net navigation