继承Boostrap按钮CSS和覆盖颜色解释

问题描述：

我希望有人可以解释我如何使一个按钮从bootstrap继承所有按钮的属性，但重写它的颜色并解释它如何以通俗者的方式工作。继承Boostrap按钮CSS和覆盖颜色解释

我有下面的类的按钮：

class="btn action-braintree-paypal-logo"

显然，btn已经从引导采取它的属性（如我使用它），然后我定义我自己action-braintree-paypal-logo。

然后我有这个在我自己的样式表：

.action-braintree-paypal-logo { 
    background-color:#019cde; 
}

，但这种颜色一直拖欠回白手起家自己的颜色，我不理解为什么。

我使用的样式表也是在我的脑袋里的引导程序之后。

任何帮助是极大的赞赏。

也许你可以尝试使用'important'覆盖！另请参见[CSS！重要规则：如何正确使用]（https://appendto.com/2016/04/css-important-rule-how-to-use-it-correctly/） –

答

请确保您所指的样式表的链接标记具有rel="stylesheet"属性，否则样式不会导入。

例子：

以下CSS将工作：

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

但是这一次没有：

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 

 
<style type="text/css"> 
 
.action-braintree-paypal-logo { 
 
    background-color:#019cde; 
 
} 
 
</style> 
 

 
<button class = "btn action-braintree-paypal-logo">Test Button</button>

谢谢，但这不是问题。 – James

@James颜色应用于引导按钮。可能是其他一些风格正在覆盖你的情况下的按钮颜色。 –

谢谢，我检查过开发人员工具，它从另一个样式表中获取它的颜色，但我的自定义样式表仍然在头后，所以我感到困惑。 – James

答

你可以使用内联的css来做这件事。在您的按钮标签

答

简单的解决方案CSS特殊性：

.btn.action-braintree-paypal-logo { 
    background-color:#019cde; 
}

答

试试这个，

.btn.action-braintree-paypal-logo { background: red; color: #fff; }

继承Boostrap按钮CSS和覆盖颜色解释

相关推荐