软件下载 | 资讯教程 | 最近更新 | 下载排行 | 一键转帖 | 发布投稿
您的位置:最火下载站 > Web前端 > 工具与技巧 > 根据主题类突出显示当前页面

根据主题类突出显示当前页面

  烈火网(LieHuo.Net)教程 一些网站的导航条,可以突出显示正在访问的页面,提示用户正在访问哪个页面。使用css怎么做到这个呢?在cssmestery上讲了一个方法(p172),我把它记录下来。

  1)使用类来标示每个页面。 

<body class="home">
<body class="about.htm">
<body class="news.htm">

  2)使用相应的ID标示链接。

<ul id="mianNav">
<li><a href="home.htm" id="home">Home</a></li>
<li><a href="about.htm" id="about">About</a></li>
<li><a href="news.htm" id="news">New</a></li>
<li><a href="interviews.htm" id="interviews">Interviews</a></li>
<li><a href="gallery.htm" id="gallery">Gallery</a></li>
<li><a href="carrers.htm" id="carrers">Carrers</a></li>
</ul>

  3)在CSS中建立页面和特定链接的关系。

body.home #mianNav a#home {
color: #fff;
}
body.home #mianNav a:hover#home {
color: #000;
}

  上面代码可以翻译成这样:寻找.home页面的中主导航条中的#home链接,其他页面也使用相似的方法处理。

    相关阅读
    栏目导航
    推荐软件