如何在HTML中的锚标记中添加活动类 [英] How to add active class in anchor tag in HTML
本文介绍了如何在HTML中的锚标记中添加活动类的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
如何在锚标签上添加/删除活动类我正在使用以下代码HTML和CSS
我应该使用什么jquery?
谢谢
我的尝试:
< pre lang = HTML >
& lt; header class =clearfix>
< div < span class =code-attribute> class = logo >
< a href = Default.aspx > < img src = images / logo.png alt = / > < / a >
< / div >
< a class = elemadded responsive-link href = # > 菜单< / a >
< nav class = nav-menu >
< ul class = menu-list nav nav-list >
< li > < a class = 有效 < span class =code-attribute> href = Default.aspx > 主页< / a > < / li < span class =code-keyword>>
< li > < a href = about.aspx > 关于< / a > < / li >
< li > < a href = gallery.aspx > 图库< / a > < < span class =code-leadattribute> / li >
< li > < a href = services.aspx > 我们的服务< / a > < / li >
< li class = drop > < a href = flowing.aspx > 我们的流量< / a >
< ul class = 下拉菜单 >
< li > < a href = collecting.aspx > 收集< / a > < span class =code-keyword>< / li >
< li > < a href = packing.aspx<填充< span> > < / li >
< li > < a href = transportation.aspx > 运输< / a > < / li >
< li > < < span class =code-leadattribute> a href = removals.aspx > 删除< / a > < / li >
< li > < a href = preaparing.aspx > ; 准备< / a > < / li >
< li > < a href = delivery.aspx > 投放< / a > < / li >
< / ul >
< / li >
< li > < a href = blog.aspx > 新闻< / a > < / li >
< li > < a href = contact.aspx > 联系< / a > < / li >
< li class = blink-text > < a href = virtualtour.aspx > 虚拟游览< / a > < / li >
< li class = < span class =code-keyword> drop > < a hre f = # > 登录< / a >
< ul class = 下拉列表 >
< li < span class =code-keyword>> < a href = DashBoardHome.aspx > 管理员< / a > < / li >
< li > < a href = ClientLogin.aspx > 客户< / a > < / li >
< / ul >
< / li >
< / ul >
< / nav >
& lt; / header>
< / pre >
标题nav.nav-menu ul.menu-list li a.active,
header nav.nav-menu ul.menu-list li a:hover {
color:#ffffff;
背景:#006db7;
}
解决方案
尝试 jQuery toggleClass()方法 [ ^ ]
How to add/remove active class on anchor tag I am using following code HTML and CSS
what jquery should I use?
Thanks
What I have tried:
<pre lang="HTML">
<header class="clearfix">
<div class="logo">
<a href="Default.aspx"><img src="images/logo.png" alt="" /></a>
</div>
<a class="elemadded responsive-link" href="#">Menu</a>
<nav class="nav-menu">
<ul class="menu-list nav nav-list">
<li><a class="active" href="Default.aspx">Home</a></li>
<li><a href="about.aspx">About</a></li>
<li><a href="gallery.aspx">Gallery</a></li>
<li><a href="services.aspx">Our Services</a></li>
<li class="drop"><a href="flowing.aspx">Our Flowings</a>
<ul class="dropdown">
<li><a href="collecting.aspx">Collecting</a></li>
<li><a href="packing.aspx">Packing</a></li>
<li><a href="transportation.aspx">Transportation</a></li>
<li><a href="removals.aspx">Removals</a></li>
<li><a href="preaparing.aspx">Preparing</a></li>
<li><a href="delivery.aspx">Delivery</a></li>
</ul>
</li>
<li><a href="blog.aspx">News</a></li>
<li><a href="contact.aspx">Contact</a></li>
<li class="blink-text"><a href="virtualtour.aspx">Virtual Tour</a></li>
<li class="drop"><a href="#">Login</a>
<ul class="dropdown">
<li><a href="DashBoardHome.aspx">Admin</a></li>
<li><a href="ClientLogin.aspx">Client</a></li>
</ul>
</li>
</ul>
</nav>
</header>
</pre>
header nav.nav-menu ul.menu-list li a.active,
header nav.nav-menu ul.menu-list li a:hover {
color: #ffffff;
background: #006db7;
}
解决方案
Try jQuery toggleClass() Method[^]
这篇关于如何在HTML中的锚标记中添加活动类的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文