如何在HTML中的锚标记中添加活动类 [英] How to add active class in anchor tag in 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">
&lt;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>
			
		&lt;/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屋！