如何覆蓋引導面板標題顏色

我知道有很多像我這樣的問題。然而他們都沒有工作。我有這個HTML文件：如何覆蓋引導面板標題顏色

<div class="container col-md-6 col-md-offset-3"> 
<div class="panel-group"> 
    <div class="panel panel-default"> 

     <div class="panel-heading-custom panel-heading ">Username</div> 
     <div class="panel-body panel-info">{{ main.username }}</div> 

    </div> 
</div>

這css文件：

.panel-default > .panel-heading-custom { 
    color: #333; 
    background: black; 
    border-color: #ddd; 
}

我已經嘗試了多種選擇：

.panel-heading .panel-default > .panel-heading .panel-default.panel-heading .panel.panel-heading

還有一些。我知道你是我們的重要人選，但我認爲這不是正確的做法。你能幫我解決嗎？

這是我的瀏覽器顯示的內容：

謝謝！

來源

2017-02-10 Diego Rios

你可以創建一個小提琴複製您的問題 – Geeky

我還沒有真正使用的jsfiddle但我給它一個嘗試 –

我試圖在此筆HTTP添加代碼：// codepen。 io/anon/pen/mRQKWp ...但無法找到任何問題與您的代碼 – Geeky

我猜你的風格被覆蓋。您可以通過確保您的樣式沒被覆蓋或者通過

！重要
你可以寫的樣式爲具有最高的特異性
如果有一個特定的類定義的兩個/更多款式或選擇，什麼都說到最後會來影響

檢查這個片段

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<style> 
 
.panel-default>.panel-heading-custom { 
 
    color: #333; 
 
    background: black; 
 
    border-color: #ddd; 
 
} 
 
</style> 
 

 
<div class="container col-md-6 col-md-offset-3"> 
 
<div class="panel-group"> 
 
    <div class="panel panel-default"> 
 

 
     <div class="panel-heading-custom panel-heading heading ">Username</div> 
 
     <div class="panel-body panel-info">{{ main.username }}</div> 
 

 
    </div> 
 
</div>

希望這有助於

來源

2017-02-10 23:23:06 Geeky

不知何故，它現在在我的瀏覽器。 ..哈哈哈謝謝！ –

如何覆蓋引導面板標題顏色

回答

相關問題