为什么我的按钮外观只在我打开新选项卡并返回后悬停在它上面时才发生变化？
这个问题涉及到前端开发中的按钮外观变化以及浏览器缓存的相关知识。
按钮外观只在打开新选项卡并返回后悬停在它上面时才发生变化的原因可能是由于浏览器缓存的机制导致的。浏览器为了提高网页加载速度和减少网络流量，会将已经访问过的资源（如CSS文件、图片等）缓存到本地。当你第一次访问网页时，浏览器会下载并缓存相关的CSS文件，其中可能包含按钮的样式定义。当你打开新选项卡并返回时，浏览器会尝试从缓存中加载已经下载过的CSS文件，从而使按钮的外观保持一致。
解决这个问题的方法可以通过以下几种方式：
- 强制浏览器不缓存按钮的样式文件：可以在按钮所在的HTML文件中的
<head>标签内添加一个meta标签，设置http-equiv属性为Cache-Control，并将content属性设置为no-cache，这样浏览器就会在每次加载页面时都重新下载CSS文件，确保按钮的外观每次都是最新的。
<meta http-equiv="Cache-Control" content="no-cache">- 使用版本号或者时间戳来更新CSS文件的URL：在引用CSS文件的地方，可以在URL后面添加一个版本号或者时间戳参数，每次更新CSS文件时修改这个参数，这样浏览器会认为是一个新的URL，从而重新下载CSS文件。
<link rel="stylesheet" href="styles.css?v=1.0">- 使用CSS样式内联：将按钮的样式直接写在HTML文件中的
<style>标签内，而不是通过外部的CSS文件引入，这样每次加载页面时都会重新应用样式，避免了缓存的问题。
<style>
.button {
/* 按钮样式定义 */
}
</style>以上是解决按钮外观只在打开新选项卡并返回后悬停在它上面时才发生变化的一些方法，具体选择哪种方法取决于你的具体需求和项目情况。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云 CDN（内容分发网络）：提供全球加速、缓存加速、安全防护等功能，可用于加速静态资源的分发，提高网页加载速度。详情请参考：腾讯云 CDN
- 腾讯云云服务器（CVM）：提供弹性计算能力，可用于部署和运行网站、应用程序等。详情请参考：腾讯云云服务器
- 腾讯云对象存储（COS）：提供高可靠、低成本的云端存储服务，可用于存储和管理各种类型的数据。详情请参考：腾讯云对象存储
- 腾讯云云数据库 MySQL 版（TencentDB for MySQL）：提供稳定可靠的云数据库服务，支持高可用、备份恢复、性能优化等功能。详情请参考：腾讯云云数据库 MySQL 版
- 腾讯云人工智能（AI）：提供丰富的人工智能服务，包括图像识别、语音识别、自然语言处理等，可用于开发智能化的应用程序。详情请参考：腾讯云人工智能
相关·内容
1回答
为什么我的按钮外观只在我打开新选项卡并返回后悬停在它上面时才发生变化？
javascript、jquery、twitter-bootstrap、jspdf
我按下一个按钮，它会通过jsPDF库为我生成一个pdf。问题是选项卡打开得太快了，我猜它影响了removeClass的视觉效果(当我在Safari中返回页面时，只有当我将鼠标悬停在它上面时，按钮才会在视觉上亮起)。我要删除的类是Bootstrap禁用的类。p
浏览 4提问于2017-07-05得票数 0
2回答
仅在Safari中显示跨度时出现奇怪的高度问题
jquery、html、css、safari
我遇到了一个问题，跨度改变高度只在Safari。
左上角是一个“项目”按钮，当你将鼠标悬停在它上面时，它会展开以显示“返回项目”。在Chrome或Firefox中，一切都很好。在Safari上，当你将鼠标悬停在跨度上时，跨度的高度和位置会发生变化，我不知道为什么。
浏览 0提问于2016-02-07得票数 0
3回答
<h:仅在验证后表单target="_blank“
java、jsf
我想要一个表单，提交和验证后，打开一个新的标签与结果。我使用<h:form target="_blank"方法获取新选项卡，但它在新选项卡中显示了验证错误。我希望它只在验证通过时才打开新的选项卡。我猜唯一真正<em
浏览 0提问于2012-11-02得票数 3
回答已采纳
1回答
Select2在不将鼠标悬停在选择框上时不突出显示选项
jquery-select2
我使用的是Select2，并使用以下代码在其开头添加了一个自定义按钮： function(on('click', alert('test'); });然而，一旦选择框打开，它会自动突出显示第一个
浏览 14提问于2018-08-24得票数 0
回答已采纳
4回答
如何将鼠标悬停在此按钮样式上？
reactjs、material-ui
这些是我的按钮代码。不知何故，只有当我在Button本身中声明样式时，背景颜色才起作用。在const useStyles中声明背景颜色不起作用，因此，我只这样做。当它悬停在上面时背景颜色会发生变化，我该如何对其进行编码呢？
浏览 84提问于2021-04-04得票数 0
回答已采纳
1回答
MVC4 & JQuery Mobile -有时某些ActionLink按钮在刷新页面或在新选项卡中打开之前无法工作
html、jquery-mobile、asp.net-mvc-4
我想弄清楚为什么在我的应用程序中创建记录后，"Create“按钮似乎不再工作了，除非我刷新页面，或者打开新窗口中的链接。我将单击右上角的"Create“按钮：
现在请注意我列表中
浏览 0提问于2013-01-14得票数 0
回答已采纳
1回答
当我从活动返回时刷新选项卡
android、android-tabhost
我有一个主TabActivity，上面有5个选项卡。每个标签页由一个异步任务组成，它检索数据并显示在ListView上。在这个主要活动的顶部，我有一个用于签入的按钮。当我按下按钮时，选项卡的内容会发生变化，所以我想在从Chekin活动返回后更新Listviews。但是当我返回
浏览 2提问于2011-07-29得票数 0
回答已采纳
1回答
Wp自定义菜单问题:在新选项卡中打开链接，同时打开相同的选项卡
wordpress
我有一个wp自定义菜单的问题，从Apperance >菜单，我将该链接设置为在新选项卡中打开。当我转到网站，点击论坛(这是我想在新选项卡中打开的按钮)时，会打开带有论坛的新选项卡，但同时，在主选项卡(它应该是Word
浏览 5提问于2011-08-12得票数 0
2回答
InfoPath 2013 web表单不打开人员选取器控件中的浏览对话框
sharepoint、infopath
我有一个用户选择器控件，当在预览模式下使用时，当我单击浏览按钮时，它会打开一个对话框来查找用户，但当部署到SharePoint服务器上时，它什么也不做。如果我在输入框中输入一个用户，check names按钮就会起作用，并在出现这种情况时提供多项选择。由于人员选择器控件在新的SharePoint 2013中进行了修改，这会不会是一个副作用？有没有人有同样的
浏览 1提问于2013-03-06得票数 1
4回答
“我感到幸运”按钮是做什么的？
google-search
我使用谷歌很多年了，但我还是不知道“我感到幸运”的按钮是什么，
以及为什么放在那里。给我解释一下。
浏览 0提问于2012-09-27得票数 4
回答已采纳
1回答
打开新页:新窗口与新选项卡
javascript、ruby、webrick
我设置了我的浏览器(Firefox 10和Chrome 16)，这样当一个新页面打开时，它就会在新选项卡的同一个窗口内打开。，新页面将在新选项卡的同一窗口中打开。这是意料之中的。
但是，当我使用本地new服务器(Ruby + Webrick)并动态生成与上面相同的内容并访问该
浏览 5提问于2011-12-31得票数 4
4回答
我在Interface Builder中的Size Inspector下完全看不到任何东西。我希望能够设置自动
xcode、interface-builder
我在界面生成器的Size Inspector下根本看不到任何设置，对于my View、all labels和all buttons，它是完全空白的。我使用的是xcode 4.6，没有勾选“Use Autolayout”，指标(大小，状态栏，顶部栏，底部栏)都是'None‘。我需要能够控制自动调整大小的蒙版，但是为什么我看不到任何大小属性？
浏览 0提问于2013-01-31得票数 23
1回答
用jQuery打开一个链接会打开相关的应用程序，但是，继续下去，一个恼人的关于:空白页被打开了。我怎么才能阻止这一切？
javascript、jquery、ios、google-chrome、hyperlink
(在iOS上以铬表示)
window.open('link', '_blank'); // Opens app as desired but al
浏览 0提问于2018-06-20得票数 0
2回答
UIButton上的文本更改不起作用
cocoa-touch、ios、ipad、interface-builder、uibutton
我的视图中有一个UIButton，上面写着"STOP“。当被按下时，它应该(当然是停止播放)将其标签更改为"RTN to ZERO“。这很简单：但是，更改只出现在瞬间。它不能坚持住。我假设按钮(按下时高亮显示)接受并显示新标签，但高亮显示只是在稍后<e
浏览 0提问于2011-04-07得票数 20
回答已采纳
8回答
如何在每次打开Chrome DevTools时保持默认隐藏的“控制台抽屉”？
javascript、google-chrome、console、google-chrome-devtools
当我打开DevTools时，有一个切换Hide Drawer.和Show Console.的小按钮。除了名称不一致之外，这个“抽屉”对我来说非常烦人，因为它占据了太多分配给devtools的小屏幕空间(我是底端对接的)。我怎样才能让这个“抽屉”永久关闭？或者如果我不能做到这一点，我能不能至少把它的高度保持得尽可能低？(每次我<e
浏览 69提问于2013-12-29得票数 73
回答已采纳
1回答
呈现后禁用Submit按钮
ruby-on-rails、ruby、ruby-on-rails-3、ruby-on-rails-4、simple-form
我正在用Rails构建一个作业应用程序。在我的工作“新”页面上。我有一个预览功能，用户可以单击“预览按钮”来查看发布时该作业的外观。预览页将在另一个选项卡中打开。然后，用户应该返回到作业“新”页面，要么发布作业，要么进行编辑。主要问题是，在我单击预览按钮并打开</em
浏览 0提问于2018-03-29得票数 0
回答已采纳
2回答
执行Python时出错：'NoneType‘对象没有属性'run_line_magic’
python、matplotlib、ipython
我在逃避一个剧本。我正在使用python 2.7.12。试图更改导入matplotlib的语法，但没有任何效果。运行python时出现的错误显示 File "LR.jpy", line 7, in <module>
ImportError: No module named ipykernel.pyl
浏览 2提问于2016-11-21得票数 1
回答已采纳
4回答
付款完成后，PayPal不会自动重定向到我的网站
paypal
由于某些原因，在确认付款后，PayPal不会重定向到我的网站。我设置了一个隐藏的参数，返回相同的url。它只是向我显示一个完整的页面与一个链接回我的网站(与上述相同的网址)。如果我点击这个，它会把我带回我<e
浏览 0提问于2012-07-25得票数 3
1回答
滚动时禁用Mega菜单面板
html、css、wordpress、megamenu
我正在使用Max mega menu插件创建我们的mega菜单，使用全宽度布局。它工作正常。当有人将鼠标悬停在菜单选项卡上时，它将打开超级菜单面板，但当我们打开面板并尝试向下滚动时，光标会向下移动，但我们仍然在该面板上。所以我们的菜单栏面板已经全宽了，在这种情况下，当有人在面板上悬停在菜单选项卡上时，当我向下滚动时</e
浏览 8提问于2019-11-15得票数 0
2回答
我正在尝试将joomla网站复制到一个网站的子域：。数据库，一切看起来都很好。当我访问时，网站会自动重定向到：，错误是：有关于这个自动重定向的想法吗?我该如何解决这个问题？
浏览 0提问于2012-07-19得票数 5
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频活动推荐
腾讯云开发者
