2015-10-12 49 views
0

我在ASP.NET MVC應用程序中使用重新啓動引導模板,並在子樣式表中應用了一堆CSS覆蓋。出於某種原因,並非所有替代項都在我的Chrome瀏覽器中生效,但我認爲選擇器的命名都是正確的。我也在鏈接到HTML標記中的父頁面之後,將鏈接放到子樣式表中,以確保它按正確的順序加載。自定義CSS覆蓋不會在ASP.NET MVC中生效

下面是一個例子,其中,在我只改變單個元件的背景色:

#social_media_wrapper { 
    background: #428bca; 
} 

兒童造型在site.css片:因爲它出現在style.css

父造型

#social_media_wrapper { 
    background: #ff8000; 
} 

以下是元素的HTML參考:

  <div id="social_media_wrapper"> 
       <a href="https://www.linkedin.com" target="_blank"><i class="fa fa-linkedin-square"></i></a> 
       <a href="http://stackoverflow.com"></i></a> 
       <a href="https://github.com" target="_blank"><i class="fa fa-github-square" target="_blank"></i></a> 
      </div> 

不知道還有什麼會在這裏缺少會導致這些孩子花式通過瀏覽器忽略,因爲沒有什麼父的造型標註!important會妨礙孩子的造型從覆蓋(特別是因爲其他孩子風格住在同一份文件中的父母毫無問題地凌駕父母身上)。

+1

您是否曾嘗試通過在子樣式表中添加'!important'來進行調試?這[jsfiddle](https://jsfiddle.net/tc0q5t7r/2/)證明瀏覽器會優先考慮順序加載的兩個選擇器中的第二個 –

+1

感謝@ToniLeigh提供調試建議。發現我錯過了文檔頂部的選擇器的結束大括號,這是Visual Studio沒有捕獲到的(但顯然是Chrome)。 – Kanapolis

+0

不錯,打算建議鉻檢查員,這是非常好的! –

回答

-1

變化

#social_media_wrapper { 
    background: #ff8000; 
} 

#social_media_wrapper { 
    background-color: #ff8000; 
} 
+0

這應該沒有什麼區別,這個建議背後的推理是什麼? –

0

變化:

#social_media_wrapper { 
    background-color: #ff8000 !important; 
} 

我希望這可以幫助。