html – 为什么这会在我的悬停元素上发生?

html – 为什么这会在我的悬停元素上发生?,第1张

概述我添加了一些悬停过渡到我的wordpress网站,我已经结合了hvr-icon-forward和hvr-fade类来自 hover.css,在悬停网站上我将这些类合并到了检查器中,它起了作用,但由于某种原因在我的网站上得到一个白色背景闪光然后显示正确的背景颜色见 gif 任何帮助,将不胜感激. HTML: <div id="home_cta"><a class="hvr-fade hvr-ico 我添加了一些悬停过渡到我的WordPress网站,我已经结合了hvr-icon-forward和hvr-fade类来自 hover.css,在悬停网站上我将这些类合并到了检查器中,它起了作用,但由于某种原因在我的网站上得到一个白色背景闪光然后显示正确的背景颜色见 gif
任何帮助,将不胜感激.

HTML:

<div ID="home_cta"><a  href="#">Building</a><a  href="#">Plumbing &amp; Heating</a><a  href="#">Self Build</a></div>

SCSS

#home_cta a { background-color: #0619BF; margin-bottom: 10px; wIDth: 50%; padding: 16px; color: white; Font-weight: bold; }#home_cta .hvr-fade { background-color: #0619BF; }#home_cta .hvr-fade:hover { background: #0000f5; background: -webkit-linear-gradIEnt(legacy-direction(to right),#0000f5 0%,#0000c3 100%); background: linear-gradIEnt(to right,#0000c3 100%); }

Jsfiddle – https://jsfiddle.net/mrjoshfisher/eh5qu0h7/3/

解决方法 你有这个闪光灯,因为在背景颜色上应用了过渡,并且在CSS中也应用了CSS渐变.

你需要在CSS中重写如下:

.hvr-fade {    Transition-property: color;}

这是工作Fiddle.

总结

以上是内存溢出为你收集整理的html – 为什么这会在我的悬停元素发生?全部内容,希望文章能够帮你解决html – 为什么这会在我的悬停元素上发生?所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1045597.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-24
下一篇 2022-05-24

发表评论

登录后才能评论

评论列表(0条)

保存