如何删除我网站上按钮的悬停效果？答案

【问题标题】：How do I remove the hover effect on the buttons on my site?如何删除我网站上按钮的悬停效果？
【发布时间】：2015-12-24 05:50:43
【问题描述】：

我网站上的按钮看起来很棒，除非您将它们悬停。当将鼠标悬停在字体上时，字体变为黑色，而按钮仅在中途变为浅橙色。按钮的顶部保持不变。我希望对控制悬停效果的属性进行 css 控制，但我看不到是什么在第一步控制它们。

      .btn {
         background-color: #f45F25;
         background-image: linear-gradient(to bottom, #f47825, #f45F25);
         border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) #f47825;
         }

网站是http://clearwaterfloridabeachrentals2.imbookingsecure.com/，按钮位于搜索框的右上角。

【问题讨论】：

标签： html css button hover

【解决方案1】：

您需要删除insta-common.css 中的以下CSS 规则（影响.btn:hover，悬停效果）：

.btn:hover, .btn:focus {
    color: #333;
    text-decoration: none;
    background-position: 0 -15px;
    -webkit-transition: background-position .1s linear;
    -moz-transition: background-position .1s linear;
    -o-transition: background-position .1s linear;
    transition: background-position .1s linear;
}

a:hover, a:focus {
    color: #005580;
    text-decoration: underline;
}

【讨论】：

我添加了代码并调整了背景位置以在悬停时覆盖整个按钮。现在的问题是按钮在悬停时变成白色，我似乎无法调整悬停颜色。
.btn:hover, .btn:focus { 颜色: #333;文字装饰：无；背景位置：0 -30px； -webkit-transition：背景位置 .1s 线性； -moz-transition：背景位置 .1s 线性； -o-transition：背景位置 .1s 线性；过渡：背景位置 .1s 线性； } a:hover, a:focus { 颜色: #005580;文字装饰：下划线； }