0

我在我的一个网站上使用 Twitter Bootstrap。我的按钮有问题。所有按钮的背景都在悬停时中断 - 在一页上。但在其他页面上工作正常。

Twitter 按钮在悬停时中断 http://oi44.tinypic.com/wre2w5.jpg

问题出现在 Firefox、chrome 和 opera 等浏览器中 - 但在 IE9 上运行良好

添加Firebug css - 点击链接查看图片文件 - Firebug css

<div class="form-actions">
<button type="button" class="btn btn-primary" id="submit-calculations">Submit</button>
<button type="reset" class="btn">Cancel</button>
</div>

好的，我已将代码添加到演示服务器。单击以下链接以查看工作示例。链接已删除

4

1 回答 1

1

您遇到此问题的原因是您有以下 CSS（在 style.css 的第 273 行附近）：

.menu-toggle:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
article.post-password-required input[type=submit]:hover {
    color: #5e5e5e;
    background-color: #ebebeb;
    background-repeat: repeat-x;
    background-image: -moz-linear-gradient(top, #f9f9f9, #ebebeb);
    background-image: -ms-linear-gradient(top, #f9f9f9, #ebebeb);
    background-image: -webkit-linear-gradient(top, #f9f9f9, #ebebeb);
    background-image: -o-linear-gradient(top, #f9f9f9, #ebebeb);
    background-image: linear-gradient(top, #f9f9f9, #ebebeb);
}

只需将其删除，一切都会按您的预期工作。

OP的补充 - 上述答案

将引导样式表中的以下行标记为重要

background-image: -moz-linear-gradient(top, #0088cc, #0044cc) !important;
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc)) !important;
background-image: -webkit-linear-gradient(top, #0088cc, #0044cc) !important;
background-image: -o-linear-gradient(top, #0088cc, #0044cc) !important;
background-image: linear-gradient(to bottom, #0088cc, #0044cc) !important;
于 2013-06-30T23:17:32.967 回答