Set navigation current page "Activate"

Source: Internet
Author: User
Tags character set
Navigation | page

This function navigation uses more, is achieves one page the navigation bar one column and other different purposes.

For example, we have a navigation bar with the following several:
Sun
Moon
Satellite

The corresponding directory structure corresponds to the page:
/sun/index.html
/moon/index.html
/satellite/index.html

For example, when the page is transferred to the "Moon" page, we want to be different on the "moon" entry of the navigation bar to highlight the current page.

Do this:

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd>
<meta http-equiv= "Content-type" content= "text/html; charset=gb2312 "/>
<title> Current document Navigation "activate" usage </title>
<style type= "Text/css" >
<!--
#nav {
Background-color: #CCCCCC;
height:200px;
width:200px;
}
#nav ul Li A.Act {
Color: #990000;
}
-->
</style>
<body>
<div id= "NAV" >
<ul>
<li><a href= "/sun/" > Sun </a></li>
<li><a href= "/moon" class= "act" > Moon </a></li>
<li><a href= "/satellite" > Satellite </a></li>
</ul>
</div>

It's simple to set up a a.act (don't confuse with A:activ), and then add a class to the href.

Finally, another point of the harvest, Dreamweaver code view, the founder of the Super Large character set "song" Is good.



Related Article

Alibaba Cloud 10 Year Anniversary

With You, We are Shaping a Digital World, 2009-2019

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.