如何使文本显示在悬停状态[当我们将鼠标悬停在任何按钮上时，通常会出现黄色背景文本]
要实现文本在悬停状态时显示黄色背景，可以通过CSS的:hover伪类来实现。下面是一个示例代码：
HTML代码：
<button class="hover-button">悬停按钮</button>CSS代码：
.hover-button:hover {
background-color: yellow;
}在上面的代码中，我们给按钮添加了一个class名为"hover-button"，然后使用:hover伪类来选择该按钮在悬停状态下的样式。当鼠标悬停在按钮上时，按钮的背景颜色会变为黄色。
关于这个问题，腾讯云没有特定的产品与之相关。但是腾讯云提供了丰富的云计算服务，如云服务器、云数据库、云存储等，可以帮助开发者构建和部署各种应用。你可以访问腾讯云官网了解更多相关产品和服务：https://cloud.tencent.com/
相关·内容
我使用下面的代码让我的按钮在悬停时变为翻转状态。
$('.button').hover(function(){
$(this).css('background-position', '0 -23px');
}, function(){
$(this).css('background-position', '0 0px');
});
将.button类应用于所有按钮div，使用背景位置函数，其中所有背景图像在同一图像中具有所有三种状态-在'0 0px‘处显示正常状态，在'0 -23px’处显示翻转状态
浏览 0提问于2013-04-08得票数 0
回答已采纳
我在使用jQuery更改属性时遇到问题
下面是我的代码：
JS:
$("#but1").hover(function()
{
$(this).attr('src', 'css/img1.jpg');
}, function()
{
$(this).attr('src', 'css/img2.jpg');
});
HTML:
<body>
<div id = "but1" class = "button&#
浏览 0提问于2015-04-10得票数 0
3回答
我熟悉使用css和“悬停”功能，但我对如何使用点击功能很感兴趣。
因此，首先要使用悬停功能，您可以拥有：
#test {
background: black;
height: 100px;
width: 100px;
}
然后当鼠标“悬停”在上方时，我希望它变成白色
#test:hover {
background: white;
height: 100px;
width: 100px;
}
那么，在点击时改变背景的方式也是类似的吗？
谢谢!
詹姆斯
浏览 1提问于2011-11-10得票数 0
8回答
我正在尝试从一个div创建一个简单的JQuery按钮，当滚动到/离开的时候，它会改变背景颜色。
到目前为止，我的代码如下所示：
<html>
<head>
<title>Div Test</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(&
浏览 8提问于2009-08-19得票数 1
回答已采纳
3回答
我有一个菜单，每次悬停它的链接，我的页面的背景颜色都会改变。现在，假设我的默认index.html颜色是蓝色，当我悬停在上面并联系时，我得到的颜色是黄色和红色。如果我点击about页面，它的背景颜色将是黄色，如果我将鼠标悬停在主页上，它将返回蓝色。发生的情况是，当我mouseOut返回页面时，背景再次变为蓝色，与我在联系人上悬停时的情况相同。
这是我在JS中的代码
$(document).ready(function() {
$('#about').hover(function() {
$('body').css('backgroun
浏览 4提问于2016-05-09得票数 0
2回答
按钮悬停颜色
、、
为清晰起见，在解析后进行编辑。
我想将按钮上方的悬停颜色从默认的蓝色更改为另一种颜色。我想做到这一点，而不必完全重新定义所有的CSS的按钮。我只想覆盖悬停颜色，保留其余的默认值。
图片：
通常，它是这样的：
悬停，是这样的：
我想要更改悬停时的突出显示颜色。
编辑：
已经尝试过：
.Cancel:hover
{
background: linear-gradient(black, white); //Tried these separately
background-color:Red;
}
和按钮标记：
<asp:Button I
浏览 3提问于2013-03-05得票数 0
回答已采纳
我正在尝试让一个黄色齿轮的图像位于一个带有黄色边框和白色背景的div中，然后在悬停时齿轮变为白色，背景变为黄色。我目前正在将第一张图片设置为div的背景，然后使用div:hover来更改悬停时的背景，但是间距等并不能很好地工作，并且边框不能正确地围绕图像。有没有可能让图片在链接中，而不是作为div的背景？下面是我使用的代码：
HTML：
<div id="settings">
<a href="settings.html"></a>
</div>
CSS：
#settings {
border: 4
浏览 2提问于2015-01-02得票数 2
我需要一个类来改变悬停时的背景位置。我做错了什么？
CSS：
#id1 { background: url(id1.png); }
#id2 { background: url(id2.png); }
.myClass:hover { background-position: bottom; color: yellow; }
HTML：
<div id="id1" class="myClass">First</div>
<div id="id2" class="myClass">Second&l
浏览 0提问于2011-12-29得票数 0
回答已采纳
我使用的是bootstrap 3.3.7按钮，并且希望当鼠标聚焦、悬停或单击时，该按钮保持相同的颜色。 <button class="btn btn-default delete-btn">Delete</button> 下面是我修改CSS选择器的背景颜色的地方： .delete-btn:hover, .delete-btn:focus, .delete-btn:active {
background-color: white;
} 这适用于焦点或悬停事件。 但是，当鼠标单击该按钮时，它将更改为默认的灰色。你知道我在这里遗漏了什么吗？抓我的头.
浏览 42提问于2017-01-21得票数 1
回答已采纳
2回答
我一直在做一个按钮，必须改变它的背景颜色，当我们悬停鼠标在它上。但不幸的是我没能做到这一点。颜色更改仅限于文本。但我希望这是整个按钮的背景。我附上了两个图片，描述了我的确切问题。
在按钮上悬停前的
在按钮上盘旋后的
在这里，你可以看到按钮的背景色并没有完全改变。
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap');
body {
background-color: white;
display: flex;
j
浏览 3提问于2021-07-02得票数 1
回答已采纳
3回答
我希望按钮在悬停时改变颜色在导航栏(.topNav)的任何位置。在我当前的代码中，只有当鼠标悬停在按钮上(.top、.middle、.bottom类)时，更改才会发生。我使用span来完成这个任务，但是这改变了.topNav类中的所有跨度。
html。
<nav class="navbar-default"
<div class="topNav">
<div class="navbar-header">
<button type="button" class=
浏览 3提问于2020-02-01得票数 0
回答已采纳
3回答
当鼠标悬停到按钮上时，如何移除折叠按钮的背景。这是照片。我真的想移除那个白色的背景当鼠标悬停到那个按钮，请帮助我。我是html和css的新手，也是引导的新手。
这是我的html代码
<nav class ="navbar navbar-default" role= "navigation">
<div class = "container">
<div class ="navbar-header">
<butto
浏览 3提问于2016-03-29得票数 2
回答已采纳
2回答
我需要使用语义标记的SEO代码友好的产品使用按钮元素，和模式属性。因此，我使用了"span“元素来分离各个项目。我设置了我想要与背景效果悬停为显示:块的项目。
工作范围: Chrome，Safari on MAC。Windows上的Chrome和IE。在Mac或Windows的FF中不工作:在FF中，不应用背景颜色悬停效果。瓦特？
不能在按钮元素中使用"ul、ol、li、div“或任何其他不是”短语内容“的元素，请参见此处：。
不能使用图像。无法使用Javascript。
编辑：“按钮:悬停”和“按钮:悬停.class”样式工作良好。“按钮.class:hover”在FF中不
浏览 5提问于2014-08-05得票数 0
3回答
正如我已经说过的，我的问题是在悬停按钮时看不到悬停操作 这是我的html按钮 <button class="btn">button</button> 这是我在scss中悬停的代码 .btn{
background-color: $secondColor;
font-variant-caps: all-petite-caps;
border-radius: 2px;
:hover{
background-color: aqua;
}
} 这是'sass watcher‘后的css代码 .b
浏览 48提问于2021-09-13得票数 0
回答已采纳
我有这个角分量，其中悬停效应目前应用于伪类:hover在.scss文件中。但是我想用动态值来应用悬停效应。
因此，假设如果我希望元素的背景在悬停时发生变化，当前的css如下所示：
.element {
display: flex;
justify-content: center;
&:hover {
background-color: red;
}
}
但是现在我希望悬停背景颜色具有动态值，这些值在用户从UI提供的组件中是可用的，所以颜色可以是任何颜色。我还想实现的另一件事是，在元素被选中时，向它添加一个类。我的意思是，当悬
浏览 2提问于2022-05-14得票数 -2
回答已采纳
我尝试了这个CSS：
html.dark .btn:hover:not(disabled),
html.dark .btn:focus {
color: #ffffff;
background-color: #222222;
*background-color: #151515;
}
html.dark .btn.disabled,
html.dark .btn[disabled] {
color: red;
background-color: #222222;
*background-color: #151515;
}
但是，当我悬停在按钮上时，我看到颜色从红色变为白
浏览 3提问于2015-06-20得票数 4
回答已采纳
4回答
我想要访问一个按钮的悬停背景颜色，以更改悬停背景颜色每次该按钮被点击。
这是index.html文件中的按钮标记
<button class="btn-hero btn-hero:hover" id="btn">click me</button>
这在css文件中：
.btn-hero {
font-family: var(--ff-primary);
text-transform: uppercase;
background: transparent;
color: var(--clr-black);
}
.btn-
浏览 4提问于2020-07-31得票数 0
回答已采纳
6回答
我有一个简单的div。
<div id="sample"></div>
我使用以下代码使其边界透明：
var sample_div = document.getElementById('sample');
sample_div.style.borderColor = 'transparent';
当鼠标指针处于悬停状态时，我想使div的边框变为蓝色。下面是我的css代码：
#sample:hover{
border: 1px solid blue;
border-color: blue;
}
当鼠标指
浏览 5提问于2015-12-17得票数 5
回答已采纳
据我所知，CSS可以用来以一种基本的方式改变:hover上元素的内容。我正在使用这个代码
HTML：
<button><span>3 replies</span></button>
CSS：
button {width:6em}
button:hover span {display:none}
button:hover:before {content:"Reply!"}
但是当我将鼠标悬停在按钮上时，它就会剧烈地抽动。
我希望我的能像的音乐播放器一样流畅
当您将鼠标悬停在lease、premium或trackout价格下的某个按钮
浏览 31提问于2013-03-18得票数 2
3回答
下面的代码在按钮被选中时将按钮文本变为深色。我假设这来自Bootstrap的btn类中嵌入的代码。选择按钮后，如何重写代码以阻止文本更改颜色？
<html>
<head>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<style>
.buttonColor{
color:#ff0000;
}
.buttonColor:hover{
浏览 2提问于2016-04-27得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
