Question

为什么以下的gradientappy类不会覆盖stripe-button-el类中的设置？

另外，有没有比使用所有！important 属性更好的方法呢？

CSS：

.gradientapply {
    background:-webkit-linear-gradient(top, #46A1DA 0%, #3083B8 100%) !important;
    background:-moz-linear-gradient(top, #46A1DA 0%, #3083B8 100%) !important;
    background:-ms-linear-gradient(top, #46A1DA 0%, #3083B8 100%) !important;
    background:-o-linear-gradient(top, #46A1DA 0%, #3083B8 100%) !important;
    background:linear-gradient(to bottom, #46A1DA 0%, #3083B8 100%) !important;
    }

HTML：

<button type="submit" ng-click="pay()" class="gradientapply stripe-button-el" style="visibility: visible;width:270px;height:72px;">
<span style="display: block; min-height: 72px;font-size:32px;padding-top:20px;">Buy Now</span></button>

示例：http://jsfiddle.net/5tyhcbwo/

Answer 1

看起来您.stripe-button-el span已应用了背景...因为它位于您的.gradientapply课程之上，您无法看到它的背景。您必须删除或覆盖.stripe-button-el span上的背景。

这里只有jsFiddle，只需添加.stripe-button-el span { background: none; }。

另外，有没有比使用所有！更重要的方法更好的方法属性？

不幸的是，没有。如果没有!important，则会应用.stripe-button-el类。

Answer 2

为什么不隐藏跨度？

.gradientapply span {opacity: 0}
.ltie9 .gradientapply span {filter: alpha(opacity=0)}

fiddle

如何覆盖类？

2 个答案: