如何在css中创建悬停链接的下划线效果
在CSS中创建悬停链接的下划线效果可以通过伪类选择器来实现。以下是一种常见的方法：
- 首先，在CSS中选择要应用效果的链接元素，可以使用a标签选择器，例如：a { text-decoration: none; /* 移除默认的下划线效果 */ position: relative; /* 设置相对定位，为伪元素提供定位参考 */ }a:hover { text-decoration: none; /* 移除默认的下划线效果 */ }a::after { content: ""; /* 必须设置content属性，否则伪元素不会显示 */ position: absolute; /* 设置绝对定位，相对于父元素进行定位 */ left: 0; /* 设置伪元素的左边距为0，使其与链接文本对齐 */ bottom: -2px; /* 设置伪元素的底边距为-2px，使其位于链接文本下方 */ width: 100%; /* 设置伪元素的宽度为100%，与链接文本宽度一致 */ height: 2px; /* 设置伪元素的高度为2px，作为下划线的高度 */ background-color: #000; /* 设置伪元素的背景颜色为黑色，即下划线的颜色 */ }通过以上步骤，就可以在CSS中创建悬停链接的下划线效果。当鼠标悬停在链接上时，链接文本下方会出现一条黑色的下划线。
- 接下来，使用伪类选择器:hover来定义鼠标悬停时的样式，例如：
- 然后，使用伪元素选择器::after来创建一个伪元素，并设置其样式为下划线，例如：
这种效果可以应用于各种链接，例如导航菜单、文章标题等。如果需要修改下划线的颜色、粗细或位置，可以根据实际需求进行调整。
腾讯云相关产品和产品介绍链接地址：
相关·内容
问题是，当聚焦和悬停伪类一起使用时，当单击ImageView时，它不会执行聚焦的伪类工作，而是执行没有伪类的工作，如果我删除悬停伪类，那么它可以正常工作，但当未聚焦时，我无法执行悬停效果。其中as l1是用户ImageView在上部锚定窗格中的I'd
CSS代码：
#l1
{
-fx-image : url(logo/user.png);
}
#l1:hover
{
-fx-image : url(logo/user1.png);
}
#l1:focused
{
-fx-image : url(logo/user1.png);
}
浏览 13提问于2019-12-17得票数 2
我希望有一个链接，看起来就像纯文本，除了光标，使用尽可能少的css。
问题是：<a>有蓝色(在悬停时会变暗)，在悬停时也有下划线。我希望它看起来像纯文本(黑色没有下划线)。
通过使用Bootstrap类“文本-黑暗”，我设法去掉了蓝色。但是，如何在不编写css的情况下消除下划线(文本修饰)？
.no-underline:hover {
text-decoration: none;
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/c
浏览 0提问于2018-04-03得票数 16
回答已采纳
1回答
我有一个按钮，我正在设计css的样式。我在按钮上有一个悬停效果，它工作得很好。但是，如果我单击该按钮并将光标移开，然后再移动回来，悬停效果就会消失。如何在css中修复此问题？
浏览 14提问于2021-09-15得票数 0
1回答
我正在创建一个网站，并在我的主页上使用悬停效果来显示部分名称。但是，当我调整屏幕大小以查看小设备视图时，悬停效果显然不起作用。如何保持此效果处于激活状态？如果可能的话，使用CSS @media。谢谢。
这是代码。
浏览 1提问于2015-06-23得票数 0
当我将鼠标悬停在元素上时，我必须创建边界效果，反之亦然。
我设法做到了，但问题是，每次我将鼠标悬停在这些元素上时，我都会取消我所悬停的元素上的悬停效果。
当我将鼠标悬停在id=上时，“12345img”得到边框，而id="12345a“得到颜色效果。当我反之亦然时，它也是有效的，但只是第一次我在它上面徘徊。
这就是代码。
<script type="text/javascript">
$(document).ready(function () {
$('.portfolioProject a').hover(func
浏览 0提问于2012-02-29得票数 1
回答已采纳
6回答
简单的问题:我有以下的标记...
<a href='#'>
<img src='icon.png'> This is the link
</a>
我想让文本在鼠标悬停时加下划线。
只选择<a>元素中的文本而不选择其他元素的CSS选择器是什么？如果没有必要，我宁愿不把它包装在任何东西里。
a:hover {
text-decoration: none;
}
a:hover <select_text_here> {
text-decoration: underline;
}
浏览 2提问于2010-03-20得票数 1
回答已采纳
我试图在同一个HTML链接中使用不同的颜色。它似乎在一开始起作用，但当我悬停在鼠标链接上时，下划线只用一种颜色绘制。
我使用这个HTML作为CSS：
body {
background: #E7CEAF;
}
a {
color: white;
background: darkred;
text-decoration: none;
}
a:hover {
color: powderblue;
text-decoration: underline;
}
.tag {
font-style: italic;
color: yellow;
}
a:hove
浏览 1提问于2021-07-16得票数 0
回答已采纳
2回答
Jquery悬停和动画
、、、
我有一个div，当你将鼠标悬停在上面时，它会显示不同的浏览器，如果它们被支持，就用css完成。然而，我也想让它们在jquery中有动画效果，我已经在工作了。
但是，如果将鼠标快速移动到悬停区域上，然后将鼠标悬停在该区域上，则不会重新触发该动画。您必须将鼠标移动到相当远的地方，然后将鼠标悬停在它上面。我发现重现这个问题的最好方法是把你的鼠标放在它上面，快速地在它上面悬停几次。
我怀疑原因是jquery仍然认为鼠标结束了，即使css隐藏了它并说它没有结束。我也认为必须将鼠标移动到很远的地方是与时间相关的，而不是距离，但还是不确定。我还尝试过.mouseover()、.hover()和.mouse
浏览 2提问于2012-06-17得票数 1
回答已采纳
我使用在我的网站上添加社交按钮。这个文件基本上是一个CSS，它使用Font，并为各种社交网络定义了周围的20+类。按钮，定义与引导社会有悬停和积极的效果。
我想做的是禁用悬停/活动效果，这样按钮就会变成静态的，即没有任何悬停/点击功能。
理想情况下，我希望有一些CSS类，比如“btn-静态”，这将取消来自悬停/活动效果的样式更改。
这有可能吗？
我想避免为每个社交网络创建单独的CSS类，或者修改原始的CSS文件。希望添加可以取消悬停/活动事件的自定义类。
例如，下面是定义的按钮：
<span class="btn btn-social btn-facebook">
浏览 0提问于2016-06-11得票数 0
回答已采纳
我试图通过JavaScript阻止浏览器使用CSS的:hover效果。
我在我的CSS中设置了a和a:hover样式，因为如果JS不可用，我想要一个悬停效果。但如果JS可用，我想用更平滑的效果覆盖我的CSS hover效果(例如使用jQuery颜色插件)。
我试过这个：
$("ul#mainFilter a").hover(
function(e){ e.preventDefault(); ...do my stuff... },
function(e){ e.preventDefault(); ...do my stuff... });
我也在retur
浏览 127提问于2010-05-03得票数 103
回答已采纳
1回答
嘿，伙计们，我对Vue，HTML，CSS和Element Plus都很陌生。我想创建一个边栏菜单与您自己的悬停效果。然而，这是不可改变的。如果您将el菜单的背景色更改为任何内容，悬停效果就会消失。我试过使用:在el菜单元素上悬停并改变背景颜色，但这似乎也不起作用。默认的悬停效果颜色是浅蓝色，但我需要它的轻灰色。
我使用的是Vue3
我想使用的侧边栏来自这里：
浏览 1提问于2022-10-24得票数 0
回答已采纳
我有一个带有:hover伪类的div，它应用了许多CSS效果来告诉用户他们正悬停在它上面。
当用户将鼠标悬停在CSS效果上时，如何通过添加.disable类禁用CSS效果？
浏览 1提问于2011-06-15得票数 2
回答已采纳
我正在做一个网站--我对html和css非常陌生，我有一个问题。您可以在这里找到我正在进行的工作：。
现在我想添加一个效果:当我将鼠标悬停在一个导航标签上('Renovaties'，'Gerechtelijke expertise‘或'Over mij')时，我希望看到该标签的悬停效果，同时看到它下面的div的悬停效果(分别是带有建筑帽子、领带和名称的那个)-反之亦然。
例如:将鼠标悬停在“Renovaties”标签上，网站将显示该标签及其下方div的悬停效果-反之亦然。
我已经寻找了五个小时的解决方案，这就是为什么我被允许在这里提问的原因;-)
万分感
浏览 3提问于2013-05-10得票数 0
3回答
有一个问题我解决不了。我试图使按钮从文本通过改变它在悬停。我使用css改变他们的字体颜色或背景颜色在悬停。这一点是没有问题的。
但是当我给他们一个链接<a href="www.twitter.com">时，我有一个问题，因为此时我的css无法工作，因为html的链接悬停和访问函数。
最大的问题是访问了。我不想看到的颜色起作用。如果访问的颜色有效，我的链接看起来不太好。
如果你能帮助我在文本中的链接(使悬停)没有问题的活跃部分.
谢谢
浏览 6提问于2015-01-14得票数 0
1回答
我真的不确定从哪里开始，但我已经在jquery中完成了一个菜单。当你现在将鼠标悬停在上面时，它会对文本进行一些淡入/淡出效果，并且链接是手动处理的。
我想添加一行简单的代码，也许是用css完成的？在你悬停的时候在每个li下移动一个项目，滑动到你悬停的li上，而不是仅仅出现。
我只是不知道从哪里开始做这样的事情，因为我以前从来没有真正做过没有图像(最好是)。当你用鼠标离开div时，它需要从某个地方开始，单独移动到ul上，然后停在任何地方，当你点击一个链接时，我想让它保持打开状态。我并不是要求任何人为我做这个(除非你喜欢)，只是为了找到正确的方向。我看过一些带有菜单的免费代码，并试图使用它们，或者
浏览 0提问于2012-07-16得票数 0
回答已采纳
假设我有这个：
#mytopbar {
background: #ffffff;
color: #000000;
line-height: 30px;
padding-left: 15px;
}
然而，我对一般的悬停/访问锚文本装饰并不满意。如何覆盖文本修饰，以便为特定ID的链接添加下划线？(不是类)
我必须在每个锚标签上提供样式，或者我可以在CSS中以某种方式做到这一点？我尝试过像#mytopbar a {...}和#mytopbar a:hover {...}这样的东西，但它不能像我希望的那样工作。
浏览 0提问于2013-07-01得票数 0
回答已采纳
请看我的现场，并悬停在圆圈图标在顶部。请注意仅在Firefox中发生的两个效果(我使用的是FF23)：
1)在工具提示的文本中添加了蓝色下划线
( 2)文本在悬停时呈现，过了一会儿，似乎模糊了。
我很难用Firebug调试它.我找不到与这些效果相对应的css元素。
以防万一，下面是一些与我如何使用工具提示样式相关的代码：
// Variable currentSelect corresponds to hex color value
// selected in the jQuery widget seen at the top left side of the page
$('#no
浏览 3提问于2013-08-27得票数 1
回答已采纳
11回答
有没有办法与:hover 相反，只使用 CSS？如下所示:如果:hover为on Mouse Enter，是否存在与on Mouse Leave等效的CSS
示例：
我有一个使用列表项的HTML菜单。当我将鼠标悬停在其中一个项目上时，会出现从#999到black的CSS颜色动画。当鼠标离开项目区域时，如何使用从black到#999的动画创建相反的效果
(请记住，我不希望只回答这个例子，而是要回答整个“:hover的对立面”问题。)
浏览 198提问于2012-06-12得票数 132
回答已采纳
5回答
所以我通过CSS添加了这个带有悬停效果的列表。HTML：
<li><a href="#">Current Period</a>
<ul>
<li><a href="#">2012</a>
<li> a href="#">2011</a> //...you get the point
CSS：
#nav a:hover {
background-color: #fff;
color:
浏览 2提问于2012-09-14得票数 7
回答已采纳
简化了更新， 不介意使用变量。(最初的问题是使用一个选择器作为变量并这样做)
从本质上讲，为什么下面会不起作用。
注意:当没有声明||，也就是第二个选择器时，这很好。但是，然后它所做的就是不允许在文本上使用一次css自然:hover方法，所以这就是为什么我首先尝试在这里添加第二个选择器。我需要悬停一个图像，并看到相应的文本链接hover**，，我还需要单独在相应的文本链接上保持悬停，以产生** hover 下划线效果。如果不能使用CSS / sass或在jQuery中使用:hover作为一个稳定的选项，那么有什么建议可以解决这个问题吗？
setInterval(function(){
浏览 2提问于2015-07-08得票数 2
回答已采纳
好吧，我想在黑白图像上添加一个很酷的效果，其中颜色在悬停时变为白色，即白色部分变成黑色，黑色变成白色。
我知道一种使用图像悬停效果的方法，即添加第二个具有所需颜色效果的相似图像，当有人悬停第二个图像时，会出现第二个图像，但我想知道我们是否可以使用CSS过滤器来实现。对于第一个图像，我使用了灰度css过滤器，但我想知道是否还有另一个效果，可以将灰阶效果中的黑白颜色逆转为白色和黑色。事先非常感谢。:)
浏览 0提问于2014-07-16得票数 1
回答已采纳
我有图片链接到我的网站上的文字。文本看起来像一个链接，当悬停在图像上时，它会出现在屏幕上的固定位置，下面是描述它的文本。我希望图像下的文本显示为纯文本，没有下划线。它在IE9，Chrome和火狐浏览器中都有，但在Safari中没有。文本链接的html如下所示：-
<p><a class="thumbnail" href="#thumb">Basil Thomas Stirratt<span><img src="images/basil stirrat.jpg" width="200
浏览 3提问于2012-07-14得票数 1
4回答
当用户在页面上悬停一个特定的链接时，我正在寻找一种方法来更改页面主体的背景(我计划根据链接悬停将背景更改为不同的颜色)，但我打算让这个效果柔和地工作，就像CSS中的过渡效果一样。有什么办法吗？使用JS甚至CSS？
对于悬停效果，我将使用JQuery的悬停函数，但我无法找到任何方法来进行软转换。
浏览 13提问于2013-08-30得票数 1
回答已采纳
11回答
网页上的链接应该总是加下划线吗？
我不相信这应该是一个硬性的规则！
在另一位开发人员抱怨我没有遵循网络标准后，我在我的上写了一篇关于这件事的评论。它又出现了，我想知道你的想法。她的论点是，为了一致性和可用性，所有的链接都必须始终加下划线。我的经理同意了，所以我在CSS中更改了两行，然后就完成了。我不介意做这项工作，但我认为现在网站的可用性较低。有太多的事情需要引起你的注意。
值得一提的是，这是一个有很多数据输入页面的网站。有问题的链接是页面左侧标题为"Menu“的框中的导航链接。当你将鼠标悬停在链接上时，下划线就会出现，当用户将鼠标悬停在链接上时，背景颜色会发生变化。我真的不敢相信我会
浏览 0提问于2008-10-20得票数 5
回答已采纳
2回答
我正在尝试遵循codepen上的教程，当用户将鼠标悬停在导航栏中的链接上时，可以制作动画下划线。目前，我已经显示了这一行，但只在整个导航列表下显示了一个下划线。我正在尝试实现显示在悬停链接下面的线条。
.navbar-fixed-left .navList a.link {
text-decoration: none;
}
/*Removing bullet points */
.navbar-fixed-left .navList li {
list-style-type: none;
}
.link::before {
transition: 300ms;
he
浏览 25提问于2021-05-12得票数 0
回答已采纳
2回答
因此，我的想法是让标题划线，并在悬停时，它应该消失，但由于某些原因，我无法找到正确的方法。
这是我的代码：
a.attr("href", jQuery('.underlined').attr("href"));
a.hover(
function() {
jQuery(this).css({"text-decoration":"none"});
},
function() {
jQuery(this).css({"text-decoration":"und
浏览 6提问于2015-01-24得票数 1
回答已采纳
3回答
我想在悬停菜单项上添加一行，就像这个网站在导航菜单上所做的那样：
我试着用css来做这件事，但是过渡效果很难看。我该怎么做呢？
非常感谢！
浏览 0提问于2014-09-05得票数 4
2回答
我进入css，删除了所有的文字装饰:下划线，但出于某种原因，它仍然出现。请有人告诉我，当你悬停在导航线上时，如何去除上面的导航下划线？
下面是Oleose主题的链接。
浏览 2提问于2015-05-19得票数 1
回答已采纳
3回答
我有一个简单的div，像这样...
<a href="#">
<div class="promo-box promo-1">
<div class="promo-content">
<h2>Heading here</h2>
<p>Text content here.</p>
</div>
</div>
</a>
...which允许我在div悬停时更改背景颜色。效果很好，但结果是，我
浏览 1提问于2014-01-22得票数 3
回答已采纳
4回答
悬停并单击Jquery
、、、
我有一个悬停效果的链接。当您将其悬停时，文本会变成红色和下划线。单击它时，文本将保持红色和下划线。
我的问题是，一旦你点击了链接，悬停效果仍然在发挥.但我不想有这种效果。
(我不使用切换，因为上一个Jquery :1.9不支持它)
$("h1").addClass("clicked")
$('h1').click(function() {
if($(this).hasClass("clicked")) {
$("span").animate({"width": "
浏览 3提问于2016-08-10得票数 2
回答已采纳
3回答
首先，这不是：的克隆，因为我想要一个纯CSS的答案。此链接中的所有答案都需要js或jQuery，其中一个CSS答案涉及背景图像。我正在试着改变不透明度，仅此而已。
CSS希望让自己适应移动革命，但我看到的每一个简单的touchDown(也就是触摸悬停)创建悬停效果的解决方案都需要javascript或jQuery。
下面是一些简单的代码来说明我的意思：
.btn {
border-radius: 5px;
display: block;
opacity: 1; <--from
background: red;
text-align: center;
line-he
浏览 2提问于2015-09-03得票数 9
回答已采纳
3回答
使用css隐藏超链接行
、、、
我有这个HTML代码
<a href="test.html">
<div class=" menubox mcolor1">
<h3>go to test page</h3>
</div>
</a>
这是css
.menubox {
height: 150px;
width: 100%;
font-size: 14px;
color: #777;
margin: 0 0 0 0;
padding: 0;
-moz-border-rad
浏览 1提问于2013-04-23得票数 4
回答已采纳
1回答
下面的小提琴显示每个对应页面的图像链接和文本链接。每个图像，当悬停时，显示彩色版本使用css。文本链接只是底部有一个边框，当悬停时。
当相应的文本链接悬停时，我需要使图像着色，当相应的图像悬停时，还需要文本链接来显示其边框。我怎样才能把这些联系起来？
请参阅，或查看下面的CSS代码：
#chorus
{
background: url('../images/work-icons/icon-chorus to size BW.jpg');
height: 85px;
left: 30px;
position: fixed;
top: 78p
浏览 1提问于2014-10-13得票数 0
回答已采纳
我已经开始学习HTML和一些CSS。我在设计我的超链接时遇到了问题。“文本装饰”属性在悬停时不适用于超链接。这是我的代码:如果你通过和CSS学习给我一个有用的建议，我和会很感激的。
浏览 4提问于2021-07-14得票数 0
回答已采纳
所以我已经建立了这个css导航栏，我有一些问题，希望有人可以帮助。就是这样的。但是当将".cssmenu ul li“的浮点属性设置为离开整个绿色背景时，就消失了。这一切为什么要发生？另外，我还使用了: used类来创建下划线扩展效果，但这似乎没有延伸到整个宽度，即使我设置了宽度: 100%悬停。提前谢谢。
因为“指向jsfiddle.net的链接必须附有代码”
.cssmenu{
width : auto;
background : #27ae60;
}
.cssmenu ul{
list-style: none;
margin: 0;
padding:
浏览 6提问于2014-06-05得票数 0
回答已采纳
1回答
对于ADA的依从性，我已经读过，我们应该有一个以上的影响悬停。例如，只改变颜色对色盲者来说是不够的，所以增加下划线会对他们有帮助。
光标的变化是否计算为悬停效果之一？我试着在几个不同的网站上搜索，但是我没能找到答案。有人知道吗？
另一个例子:添加下划线并将光标更改为指针的悬停效果是否符合WCAG级别(A、AA、AAA)？
浏览 2提问于2022-01-10得票数 0
我正在这里的一个网站工作：
如果你悬停在右边的导航，你会看到一个褪色的效果，当背景动画从中间的链接到顶部和底部。在三条彩色线(右导航的边框)之间，你会看到有白色。这是因为在网站的其他页面上，背景是白色的，而最初的程序员只是使用背景图像来创建导航项的“对角线”边缘。现在有一个完整的页面视频/图像，这是不工作的，因为背景不是白色的，效果已经失去。
我的客户现在只希望它是透明的剃须刀线，但保持导航项目与对角线边缘。如果我移除导航项末尾的图像，它们就会变成直矩形。我尝试过一些带有边框/边框宽度等的CSS，但这有点棘手，因为如果您查看源代码，背景是由一个使用imagecreatetruecolor创建
浏览 1提问于2013-10-14得票数 0
回答已采纳
Functionality:
当用户悬停在按钮上方时，按钮应具有以下效果：
按钮应该有弹出式效果。
按钮边框应具有白色阴影效果。
做了什么：：
我利用了
img:hover{
border-color: white;
}
试图获得白色的边界阴影的效果。
发行：
我似乎不能真正达到上述效果。然而，我得到了这样的效果：
img:hover{
background-color: white;
}
当用户悬停在按钮上方时。
因此，我如何能够创建css，当用户悬停在按钮上方，它将创建上述效果。
谢谢。
i
浏览 3提问于2016-01-04得票数 0
1回答
当用户悬停时，我添加了CSS以创建下划线。链接是用于提交表单的Javascript命令。
我遇到的问题是：
如果在其中一个上滚动，它会触发另一个链接，两者都会触发，或者两者都不会触发。
下面是CSS：
a:link {
color: black;
text-decoration: none;
}
a:hover {
text-decoration: underline;
text-underline-position: under;
text-decoration-color: #ff0000;
}
a:active {
color: #ff0000;
text-decoration:
浏览 0提问于2018-07-01得票数 1
3回答
我正在尝试使用以下技术来创建弹出图像悬停效果，这是我用php动态生成的。我对这种技术有一个问题，那就是在页面加载时会下载每个图像。我怎么能让css只下载悬停的图像呢？现在css在页面加载时将图片从屏幕上推走(左：-1000px;)，然后将它们带回hover.Is上。使用css可以做到这一点，那么我还有其他选择吗？
浏览 0提问于2011-07-22得票数 2
11回答
我需要在整个DOM中的特定按钮(而不是所有按钮)上禁用鼠标悬停。请让我知道如何使用CSS类来实现它。
当我的按钮被禁用时，我正在使用下面的CSS类。现在，我想使用相同的类来移除悬停效果。
.buttonDisabled
{
Cursor:text !important; Text-Decoration: None !important;
}
上面的类将负责删除鼠标悬停时的手势和文本下划线。现在我也想去掉悬停效果。请让我知道。
浏览 4提问于2014-11-05得票数 85
我试图创建一个悬停面板效果，它会弹出左边，但我有一些麻烦，它。我附上了一张我想要产生的效果的图片。
有一个例子说明了我试图在CodePen上做些什么。看看这个：
我今天一定有一个完全的精神障碍，因为我根本想不出这一点。我的目标是在没有javascript的情况下做到这一点，因为它是CSS专用的东西。，我真的很难让“弹出”正确定位。
的具体问题是：
在悬停(返回到它应该的默认状态)后，条目在IE中消失。
悬停的“弹出”迫使一个水平滚动条出现。
某种类似于HTML/CSS的天才能伸出援手吗？
谢谢,
亚当。
浏览 8提问于2012-10-03得票数 3
回答已采纳
1回答
有没有可能在图像上保持CSS悬停效果，即使在它上面显示了一个新的图层？
例如，我有这样一个CSS：
#rit{
background: url(images/rits.png) no-repeat;
height: 295px;
}
#rit:hover{
background: url(images/rits_h.png) no-repeat;
height: 295px;
}
...and，然后一些单独的CSS添加了一个‘查看更多’按钮。当我将鼠标悬停在“阅读更多”按钮上时，上面CSS的效果就消失了。
浏览 2提问于2013-11-06得票数 1
3回答
我遇到了这个问题，我的导航链接在悬停时带有下划线。我尝试放置文本装饰:无。我看了我的整个css，但我找不到下划线的原因。
所以我使用了firebug，并检查了它给我下划线的特定位置的css。我得到了这个css，它不是我自己的。
@font-face {
font-family: "EB Garamond";
font-style: normal;
font-weight: 400;
src: local("EB Garamond"), local("EBGaramond"), url("http://the
浏览 2提问于2012-07-26得票数 0
回答已采纳
2回答
在我的新网站，我有几个不同的悬停状态的链接。其中一个交换了一个背景图像的标志。一种是将不同的背景图像转换为主导航。而普通的内联链接通过CSS改变背景色。我想不出一种自动让所有()标记优雅地移动到它们的悬停状态的方法。
手动为每种链接类型编写动画方法似乎不太干净(或未来的证明)。把我的背景图片、URL和链接颜色(应该在CSS中)放到JS中似乎是不对的。似乎不应该为悬停效果的每个实例创建一个特殊的类，然后通过jQuery动画化该类的添加/删除，这时可以使用CSS提供的默认a:悬停行为。
所以我只想知道是否有什么方法可以让jQuery (不管有没有jQuery UI)在a和a之间交叉淡出:悬停已经在
浏览 2提问于2010-09-06得票数 4
3回答
我希望在一个链接上有悬停样式，但不是在一个跨度上，它是该链接的一个子节点。我以前从没做过，但我试过了
.properties #content table th a {
color: #fff;
text-decoration: none;
}
.properties #content table th a:hover {
text-decoration: underline;
}
.properties #content table th a:hover span.sort-direction {
text-decoration: none;
}
悬停下划
浏览 5提问于2010-02-19得票数 3
回答已采纳
5回答
我想创建一个简单的悬停效果，我有一个灰色的facebook，twitter和youtube图像，当它悬停时，我想从社交媒体上获得原始颜色，这就是我想要的。
这是我的html。
<div class="social-top">
<ul>
<li><a href=""><img src="images/social/fb.png"></a></li>
浏览 0提问于2013-05-24得票数 4
1回答
我最近开始学习使用CSS的动画。它比JS和flash更容易，重量也更轻，但我知道CSS动画有局限性。
在上面的链接中，我只是想知道悬停在"Order Now“div上的效果是只通过CSS实现的，还是涉及到JS。我一直在尝试从页面源代码中挑选出对此效果负责的代码，但我只幸运地使用了CSS。我看不到任何改变div样式的JS。也许我错了。
有什么帮助吗？
浏览 2提问于2013-10-20得票数 0
1回答
CSS中具有悬停效果的点击
、、、、
我正在尝试制作一个没有链接的按钮，因为背景已经被链接了。因此，你应该能够通过它。我知道指针-事件:没有，但当使用这个，div的:悬停将不再工作。
有办法做到这一点吗？
我的HTML是：
<div class="button">
<span>Click here</span>
</div>
CSS：
.button { pointer-events: none; }
.button:hover { ... }
“按钮”类应该具有:悬停效果+单击通过。此设置将不会显示:悬停效果。
浏览 11提问于2014-11-05得票数 1
回答已采纳
2回答
我以前从未见过这样的悬停效果，我正试图了解它是如何实现的。您将注意到，当用户悬停在链接上时，链接的颜色可以是任意分配到样式表中的5种颜色中的1种(参见下面)。如何创建这种悬停效果？它能完全用CSS吗？
a:hover {
color:#1ace84;
text-decoration: none;
padding-bottom: 2px;
border: 0;
background-image: none;
}
a.green:hover { color: #1ace84; }
a.purple:hover { color: #a262c0; }
a.teal:hove
浏览 2提问于2012-03-07得票数 6
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
