在导航条中突出显示当前页面

工作方式是,在每个页面的主体元素中添加一个ID或类名,从而指出用户当前在哪个页面中。然后,在导航列表中的每个项中添加一个对应的ID或类名。可以使用主体的ID或列表ID/类的唯一组合在站点导航中突出显示当前部分或页面。

1、HTML代码片段

<body id="fuwu">

<ul class=".right_dh">
<li class="home"><a href="#"><b>首页</b></a></li>
<li class="shoping"><a href="#"><b>轻松购物</b></a></li>
<li class="tiyan"><a href="#"><b>易享体验</b></a></li>
<li class="store"><a href="#"><b>逛逛专卖店</b></a></li>
<li class="fuwu"><a href="#"><b>服务中心</b></a></li>
</ul>

2、为了突出显示当前页面,只需要寻找以下ID和类名的组合:

#home .right_dh .home a,#shoping .right_dh .shoping a,#tiyan .right_dh .tiyan a,#store .right_dh .store a,#fuwu .right_dh .fuwu a,#member .right_dh .member a{color:#fff;background:url('../images/link.gif') no-repeat;cursor:default}

最后的效果:(当用户进入频道时,黑色的方块就会停留在当前频道页面上)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值