Loading...
  所在位置:论坛首页 -> ┈┋电脑网络技术区┋┈ -> 网页制作技术 -> 网页导航上用CSS标志当前页效果的实现
标题:网页导航上用CSS标志当前页效果的实现收藏 编辑 删除 楼主 | 上一篇 下一篇
天使走了
等级:社区游民
权限:普通用户
积分:7
金钱:415
声望:7
经验:7
发帖数:92
注册:2008年3月14日
资料 短消息2008-7-13 11:02:56

当前页面--比如说现在的页面是首页,那么在导航栏上首页的色彩等和其他栏目有所不 同,用以给浏览者一个明显的指示。

下面来说下具体的做法,菜单的基本实现和一般的CSS菜单没多大区别,着重说下如何 实现当前页。

设菜单有5个栏目:home、about、products、services、contact,分别给每个栏目一 个ID,m1-m5,CSS可写成如下:

#home #nav li#m1 a, #about #nav li#m2 a, #products #nav li#m3 a, #services #nav li#m4 a, #contact #nav li#m5 a{color: #FFF; background: #DC4E1B url(navbg.gif) no-repeat; }

xhtml:

<ul id="nav">

<li id="m1"><a href="index.html">Home</a></li>

<li id="m2"><a href="about.html">About</a></li>

<li id="m3"><a href="products.html">Products</a></li>

<li id="m4"><a href="services.html">Services</a></li>

<li id="m5"><a href="contact.html">Contact</a></li>

</ul>

然后分别给每个页面的bady标签一个独立的ID,例如给首页的ID是home,其余的类推 。

这样做法的好处是每个页面的菜单都是一样的,方便修改,动态页包含也容易

2008-7-13 11:02:56 顶部
第1页 共页 共0个回复     <<    >>    
 快速回复
  • 支持UBB,HTML标签

  • 高级回复

  • 操作选项:评分 加精 解精 奖惩 设专题 设公告 解公告 固顶 总固顶 解固顶 结帖 解结帖 锁帖 解锁 移帖 删帖
      首页 | 购买指南 | 商业版本 | 虚拟主机 | 特色介绍 | 下载中心 | 支付方式
    Copyright 2004-2008 BBSGood.com Powered By: BBSGood.Speed Version 5.0
      咨询电话:0575-85513832、0575-85513825(传真)、7*24小时咨询服务:13606552007 不良信息举报中心 浙ICP备05029817号
      业务QQ:38958768、客服QQ1:415896239、客服QQ2:343896043、MSN:jccsxx@hotmail.com