如何拥有多个链接悬停颜色，不同的每个滚动？
要实现多个链接悬停颜色不同的效果，可以通过CSS来实现。以下是一种实现方式：
- 首先，在HTML中创建多个链接元素，例如：
<a href="#" class="link">Link 1</a>
<a href="#" class="link">Link 2</a>
<a href="#" class="link">Link 3</a>- 在CSS中定义链接的样式，并使用伪类选择器:hover来设置悬停时的样式，例如：
.link {
color: blue; /* 设置链接的默认颜色 */
}
.link:hover {
color: red; /* 设置链接的悬停颜色 */
}通过上述CSS代码，所有的链接元素都会有相同的默认颜色（蓝色），当鼠标悬停在链接上时，链接的颜色会变为红色。
如果需要每个链接的悬停颜色都不同，可以为每个链接添加不同的类名，并在CSS中为每个类名定义不同的悬停颜色，例如：
<a href="#" class="link link1">Link 1</a>
<a href="#" class="link link2">Link 2</a>
<a href="#" class="link link3">Link 3</a>.link1:hover {
color: red; /* 设置链接1的悬停颜色 */
}
.link2:hover {
color: green; /* 设置链接2的悬停颜色 */
}
.link3:hover {
color: orange; /* 设置链接3的悬停颜色 */
}通过上述CSS代码，链接1的悬停颜色为红色，链接2的悬停颜色为绿色，链接3的悬停颜色为橙色。
这样，每个链接都可以拥有不同的悬停颜色，实现了多个链接悬停颜色不同的效果。
关于云计算、IT互联网领域的名词词汇，可以参考腾讯云的文档和知识库，其中包含了丰富的云计算相关知识和产品介绍。具体链接地址可以根据实际情况进行查找。
相关·内容
1回答
我想知道最好和最简单的方法来使一个链接的悬停状态为5种不同的预选颜色之一，每次你滚动然后重新启动时，它都会发生变化。也就是说，有一个指向“联系人”的黑色链接，如果你将光标悬停在它上面，它就会变成蓝色。移动光标，然后将其返回到链接上，现在它是红色的，依此类推。 我认为js是最好的方法，但我还不是很熟练。如果有类似的概念，我还想知道如何</e
浏览 19提问于2020-04-11得票数 2
回答已采纳
标题中出现的链接有不同的背景颜色:当页面加载时，它们将以黄色悬停开始，然后当用户滚动下来(背景消失)时，我们希望像其他链接一样保持蓝色悬停。(本节使用“页眉-链接颜色”类，我们有针对不同颜色的‘未滚动’子类)。我有javascript添加/删除类“未滚动”取决于用户是否滚动。但是在上
浏览 2提问于2018-06-28得票数 0
回答已采纳
问题：这意味着当我将鼠标光标悬停在PDF文件中的链接上(不点击它)时，链接会更改为不同的颜色。如果我鼠标移开光标，链接就会变回原来的颜色。我正在寻找的效果是类似于堆栈溢出网站
浏览 7提问于2015-01-26得票数 2
2回答
我想让每个<li>有一个不同的背景颜色，只有当鼠标盘旋在它上面。这个很管用。.horizontalMenu li {}
background-color: #ffffff;
color: #00
浏览 2提问于2015-11-03得票数 1
回答已采纳
1回答
我有一个徽标标题和下面的5个链接作为主导航。我想取代的主标志图像与颜色变化的标志，每次一个链接是悬停。因此，每个链接将有5个不同颜色的徽标。将鼠标悬停在链接上，徽标将显示为更改颜色。我正在寻找很多解决方案，使悬停图像改变另一个图像和悬停链接，使图像显示，但没有帮助我。
任何帮助都将不胜感激！
浏览 2提问于2011-08-04得票数 0
5回答
id="tab-6">Radiology</a> </div>以及下面的CSS，它在悬停时改变背景色second-menu-navi a:hover, #second-menu-navi a.active {}
我试图通过添加以下CSS将
浏览 5提问于2014-03-19得票数 0
回答已采纳
对于所有颜色不同的桌面单元格，是否有可能具有相同的悬停效果？black;}
<td style="background-color:red;">
悬停不起作用然后我尝试使用#id为每个单元分配不同的单元格颜色，仍然悬停效果不
浏览 6提问于2017-05-29得票数 0
回答已采纳
2回答
当我将我的页脚文本链接到内容时，它会将它们更改为深灰色，因为我网站其余部分的链接都设置为这种颜色。我正在寻找一些CSS来选择并仅将我的页脚链接颜色更改为#fff，最好是使用#fa5705的悬停颜色。当我使用firebug进行检查时，我似乎不能选择正确的选择器，而且只针对整个网站。感谢您抽出时间为我调查这件事。
浏览 2提问于2013-06-14得票数 1
回答已采纳
我有一个页面上有多个地图，每个地图将显示不同的地区数据时点击，并有不同的地区颜色。不，我已经完成了所有这些:我可以切换地图，这将加载不同的数据集，并更改非活动区域颜色，但我不知道如何更改悬停颜色或活动颜色。现在，我正在使用以下命令更改非活动颜色：
$.each(stateMap.regionCodes, function(i,
浏览 5提问于2013-10-07得票数 1
我已经尝试使行可选，但我希望能够单击行中的任何位置并将其链接到某处。每一行都应该有不同的链接。
下面的方法将我所有的Table.Cells放入一个单元格，即使我指定了多个单元格。下面的方法解决了这个问题，但使每个单元格都有一个悬停，而不是整行悬停。我只想让每一行可选，并悬停在相同的颜色，并有每一行链接到不同的链接</em
浏览 22提问于2019-10-28得票数 3
回答已采纳
1回答
我的css中有社交平台的div。我想改变每个平台在悬停时的颜色。他们在<span>。如何在CSS中到达？span class="fa fa-twitter fa-4x"></span> </ul>
我就是这样改变了所有社会联系的</e
浏览 1提问于2017-08-09得票数 0
1回答
在页面上滚动时的菜单悬停效果
、、、、
我创建了一个带有顶部导航栏的站点，其中包含指向同一页面中不同内容的锚点的超链接。我试着在谷歌上搜索，但找不到任何相关的东西。有没有人可以给我指出正确<e
浏览 1提问于2014-10-01得票数 0
1回答
每当我在下面代码中的每个链接上滚动鼠标几次时，我都会遇到这个奇怪的问题，链接将持续悬停效果太长时间，并重复应用它。我有它，以便jquery在它们悬停在其上时更改它们的类，以便突出显示鼠标所在的类。250); $(this).switchClass('hover-on', 'hover', 250);})
浏览 2提问于2012-02-13得票数 1
回答已采纳
2回答
我已经创建了一个链接横跨整个页面的网页。当我将鼠标悬停在每个标题上时，它都有一个背景颜色。但是，悬停大小是固定的大小。我想知道如何让悬停根据链接长度自动调整。/*在悬停时将链接颜色更改为#272727 */ { max-width:200px;}
谢
浏览 0提问于2016-05-28得票数 0
1回答
我的博客上有一个奇怪的CSS问题，你可以在这里看到：
对于我的主内容区域中的文本链接，它们有一种背景颜色和一种不同的文本颜色，它们在滚动时会发生变化。对于同样具有超链接的图像，您将看到由于此CSS代码的结果，它们的底部有一条黑线。将鼠标悬停在图像上时，黑线将消失(复制文本链接的行为)。我可以在
浏览 0提问于2012-08-04得票数 0
4回答
链接在固定的导航栏中不起作用
、、、、
我目前正在处理一个带有滚动导航栏的页面。条形图滚动得很好。然而，当我尝试让它链接到其他内容时，它不起作用。事实上，悬停效果不会起作用。页面在这里：
一旦你向下滚动经过社交媒体图标，导航栏就会出现，就像我想要的那样。当你将鼠标悬停在链接上时，主页链接不会改变颜色，也不会转到Facebook，一旦我将其上传到web上，about链接就会改变颜色，但链接</em
浏览 2提问于2016-01-25得票数 0
我如何使用jquery来实现链接的悬停效果，这个链接通常是用css :悬浮的，所以当我在链接上悬停时，它会改变为不同的颜色，而当我的鼠标离开链接时，它会返回到以前的颜色？编辑我的链接有一个内联样式，可以设置它的颜色，所以我尝试添加和删除它们不工作的<
浏览 3提问于2011-09-01得票数 1
回答已采纳
3回答
我有一系列的CSS规则添加FontAwesome图标前/后的PDF链接，电话号码，电子邮件地址等。href="tel:131313">131313</a></p>
<p><a href="/test.html">Normal link - no i
浏览 7提问于2021-12-14得票数 0
回答已采纳
我目前正在为微软的考试做准备.在实践中，我发现了以下问题，但我无法解释答案。
答:链接a:访问a:悬停a:活动
浏览 2提问于2017-02-01得票数 2
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
