繼承Boostrap按鈕CSS和覆蓋顏色解釋

我希望有人可以解釋我如何使一個按鈕從bootstrap繼承所有按鈕的屬性，但重寫它的顏色並解釋它如何以通俗者的方式工作。繼承Boostrap按鈕CSS和覆蓋顏色解釋

我有下面的類的按鈕：

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

顯然，btn已經從引導採取它的屬性（如我使用它），然後我定義我自己action-braintree-paypal-logo。

然後我有這個在我自己的樣式表：

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

，但這種顏色一直拖欠回白手起家自己的顏色，我不理解爲什麼。

我使用的樣式表也是在我的腦袋裏的引導程序之後。

任何幫助是極大的讚賞。

來源

2017-09-14 James

也許你可以嘗試使用'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>

來源

2017-09-14 09:41:19

謝謝，但這不是問題。 – James

@James顏色應用於引導按鈕。可能是其他一些風格正在覆蓋你的情況下的按鈕顏色。 –

謝謝，我檢查過開發人員工具，它從另一個樣式表中獲取它的顏色，但我的自定義樣式表仍然在頭後，所以我感到困惑。 – James

你可以使用內聯的css來做這件事。在您的按鈕標籤

來源

2017-09-14 11:08:27 Shikha23

簡單的解決方案CSS特殊性：

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

來源

2017-09-14 12:03:23

試試這個，

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

來源

2017-09-14 12:35:18 naveen

繼承Boostrap按鈕CSS和覆蓋顏色解釋

回答

相關問題